fix(curriculum): small fixes in cat painting project (#54918)

This commit is contained in:
yoko
2024-05-23 16:35:13 +09:00
committed by GitHub
parent 72e10e59b5
commit f5a37bab1b
12 changed files with 13 additions and 13 deletions

View File

@@ -11,7 +11,7 @@ As you did for the left ear, rotate the right ear at 45 degrees.
# --hints--
You should set the `transform` property of your `.right-ear` element to `rotate(45deg)`. Don't forget to add a semi-colon.
You should set the `transform` property of your `.cat-right-ear` element to `rotate(45deg)`. Don't forget to add a semi-colon.
```js
assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.transform === 'rotate(45deg)')

View File

@@ -11,7 +11,7 @@ The ears should always be placed above the part of the head it overlaps. You can
`z-index` is a property you can use to define the order of overlapping HTML elements. Any element with a higher `z-index` will always be positioned over an element with a lower `z-index`.
To see `z-index` in action, set the `z-index`property of the left ear to `-1`.
To see `z-index` in action, set the `z-index` property of the left ear to `-1`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-33
# --description--
Set the `z-index`property of the right ear to `1` so it always stays over the head.
Set the `z-index` property of the right ear to `1` so it always stays over the head.
# --hints--

View File

@@ -9,7 +9,7 @@ dashedName: step-40
You will now start working on the cat's eyes. Like the ears, the eyes will have inner eyes.
Create a `div` element with the class `cat-eyes`. Inside the `cat-eyes` element, create two `div` elements with the class `cat-left-eye` and `cat-right-eye` respectively.
Create a `div` element with the class `cat-eyes`. Inside the `.cat-eyes` element, create two `div` elements with the class `cat-left-eye` and `cat-right-eye` respectively.
# --hints--

View File

@@ -11,7 +11,7 @@ Inside the `.cat-right-eye` element, create another `div` element with the class
# --hints--
You should not change the existing `div` element with the class `cat-left-eye`.
You should not change the existing `div` element with the class `cat-right-eye`.
```js
assert(document.querySelectorAll('div.cat-right-eye').length === 1);

View File

@@ -7,7 +7,7 @@ dashedName: step-44
# --description--
Move the left eye into position with a `position` property of `absolute` a `top` of `54px`, and a `left` of `39px`.
Move the left eye into position with a `position` property of `absolute`, a `top` of `54px`, and a `left` of `39px`.
# --hints--

View File

@@ -13,13 +13,13 @@ Create a `div` element with the class `cat-mouth`.
# --hints--
You should create a `div` element.
You should create a `div` element.
```js
assert(document.querySelectorAll('div').length === 13)
```
Your `div` element should have the class `cat-mouth`
Your `div` element should have the class `cat-mouth`.
```js
assert(document.querySelectorAll('div')[12].classList.contains('cat-mouth'))

View File

@@ -11,7 +11,7 @@ Using a class selector, give your `.cat-mouth-line-left` element a `position` of
# --hints--
You should have a `cat-mouth-line-left` selector.
You should have a `.cat-mouth-line-left` selector.
```js
assert(new __helpers.CSSHelp(document).getStyle('.cat-mouth-line-left'))

View File

@@ -11,7 +11,7 @@ Using the `transform` property, rotate the left mouth line at `170` degrees.
# --hints--
Your `.cat-mouth-line-left` property should have a `transform` property set to `rotate(170deg)`.
Your `.cat-mouth-line-left` selector should have a `transform` property set to `rotate(170deg)`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.cat-mouth-line-left')?.transform === 'rotate(170deg)')

View File

@@ -11,7 +11,7 @@ Rotate the right mouth line at `165` degrees.
# --hints--
Your `.cat-mouth-line-left` property should have a `transform` property set to `rotate(165deg)`.
Your `.cat-mouth-line-right` selector should have a `transform` property set to `rotate(165deg)`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.cat-mouth-line-right')?.transform === 'rotate(165deg)')

View File

@@ -7,7 +7,7 @@ dashedName: step-79
# --description--
Use a class selector to target the `cat-whisker-right-middle` element, then move the right middle whisker into position with a `position` of `absolute`, a `top` of `127px`, and a `left` of `109px`.
Use a class selector to target the `.cat-whisker-right-middle` element, then move the right middle whisker into position with a `position` of `absolute`, a `top` of `127px`, and a `left` of `109px`.
# --hints--

View File

@@ -9,7 +9,7 @@ dashedName: step-16
You should now center the cat head.
Give the `.cat-head` element a position property set to `absolute`. Set a value of `0` for the `right`, `left`, `top`, `bottom` properties, then set its `margin` property on all sides to `auto`. That's one way to center an element vertically and horizontally using CSS positioning.
Give the `.cat-head` element a `position` property set to `absolute`. Set a value of `0` for the `right`, `left`, `top`, `bottom` properties, then set its `margin` property on all sides to `auto`. That's one way to center an element vertically and horizontally using CSS positioning.
# --hints--