diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d1.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d1.md index c94c7ea43b1..9e589da64da 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d1.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d1.md @@ -7,7 +7,7 @@ dashedName: step-9 # --description-- -Give your background buildings element a `width` and `height` of `100%` to make it the full width and height of its parent, the `body`. +Give your `.background-buildings` element a `width` and `height` of `100%` to make it the full width and height of its parent, the `body`. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d6.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d6.md index 86206d77cd4..666ecaffb1d 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d6.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d6.md @@ -7,7 +7,7 @@ dashedName: step-14 # --description-- -Now you have something that is resembling a building. You are ready to create your first variable. Variable declarations begin with two dashes (`-`) and are given a name and a value like this: `--variable-name: value;`. In the `.bb1` class, create a variable named `--building-color1` and give it a value of `#999`. +Now you have something that is resembling a building. You are ready to create your first variable. Variable declarations begin with two dashes (`-`) and are given a name and a value like this: `--variable-name: value;`. In the rule for the `bb1` class, create a variable named `--building-color1` and give it a value of `#999`. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md index eaca278f248..b993c80f852 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md @@ -13,7 +13,7 @@ Add the variable `--building-color1` you created in the previous step as the val # --hints-- -The `background-color` of the `bb1a` element should be set. +The `background-color` of the `.bb1a` element should be set. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1a')?.backgroundColor) diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md index 61119a27de3..ac248954dae 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md @@ -11,7 +11,7 @@ Use the same variable as the `background-color` of the `.bb1b`, `.bb1c`, and `.b # --hints-- -The `background-color` of the `bb1b` element should be set. +The `background-color` of the `.bb1b` element should be set. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1b')?.backgroundColor) @@ -23,7 +23,7 @@ You should use `var(--building-color1)` to set the `background-color` of the `.b assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1b')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` -The `background-color` of the `bb1c` element should be set. +The `background-color` of the `.bb1c` element should be set. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1c')?.backgroundColor) @@ -35,7 +35,7 @@ You should use `var(--building-color1)` to set the `background-color` of the `.b assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1c')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` -The `background-color` of the `bb1d` element should be set. +The `background-color` of the `.bb1d` element should be set. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1d')?.backgroundColor) diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98da.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98da.md index 2a54a2be739..2bdce33b6e4 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98da.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98da.md @@ -7,7 +7,7 @@ dashedName: step-18 # --description-- -Your first building looks pretty good now. Nest three new `div` elements in the `background-buildings` container and give them the classes of `bb2`, `bb3`, and `bb4` in that order. These will be three more buildings for the background. +Your first building looks pretty good now. Nest three new `div` elements in the `.background-buildings` container and give them the classes of `bb2`, `bb3`, and `bb4` in that order. These will be three more buildings for the background. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98dd.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98dd.md index 17d7149403d..ffbc76b0b1c 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98dd.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98dd.md @@ -7,7 +7,7 @@ dashedName: step-21 # --description-- -The buildings are too spaced out. Squeeze them together by adding two empty `div` elements to the top of the `background-buildings` element, two more at the bottom of it, and one more in between `.bb3` and `.bb4`. These will be added as evenly-spaced elements across the container, effectively moving the buildings closer to the center. +The buildings are too spaced out. Squeeze them together by adding two empty `div` elements to the top of the `.background-buildings` element, two more at the bottom of it, and one more in between `.bb3` and `.bb4`. These will be added as evenly-spaced elements across the container, effectively moving the buildings closer to the center. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e4.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e4.md index 8ebf142eb2e..2950703ad30 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e4.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e4.md @@ -7,7 +7,7 @@ dashedName: step-28 # --description-- -The background buildings are starting to look pretty good. Create a new `div` below the `background-buildings` element and give it a class of `foreground-buildings`. This will be another container for more buildings. +The background buildings are starting to look pretty good. Create a new `div` below the `.background-buildings` element and give it a class of `foreground-buildings`. This will be another container for more buildings. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e5.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e5.md index 7029263989a..e19eefd591d 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e5.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e5.md @@ -7,7 +7,7 @@ dashedName: step-29 # --description-- -You want the foreground buildings container to sit directly on top of the background buildings element. Give it a `width` and `height` of `100%`, set the `position` to `absolute`, and the `top` to `0`. This will make it the same size as the body and move the start of it to the top left corner. +You want the `.foreground-buildings` container to sit directly on top of the `.background-buildings` element. Give it a `width` and `height` of `100%`, set the `position` to `absolute`, and the `top` to `0`. This will make it the same size as the body and move the start of it to the top left corner. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e8.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e8.md index 94b88fb38c6..3714432e6f6 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e8.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e8.md @@ -7,7 +7,7 @@ dashedName: step-32 # --description-- -Add the same `display`, `align-items`, and `justify-content` properties and values to `foreground-buildings` that you used on `background-buildings`. Again, this will use Flexbox to evenly space the buildings across the bottom of their container. +Add the same `display`, `align-items`, and `justify-content` properties and values to `.foreground-buildings` that you used on `.background-buildings`. Again, this will use Flexbox to evenly space the buildings across the bottom of their container. # --hints-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md index 3490075ae29..19c5650bdf4 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md @@ -29,7 +29,7 @@ You should remove the `top` property from `.foreground-buildings`. assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.foreground-buildings')?.top); ``` -You should add the `position` property of `absolute` to `.background-buildings, foreground-buildings`. +You should add the `position` property of `absolute` to `.background-buildings, .foreground-buildings`. ```js function eitherOr() { @@ -39,7 +39,7 @@ function eitherOr() { assert.equal(eitherOr()?.position, 'absolute'); ``` -You should add the `top` property of `0` to `.background-buildings, foreground-buildings`. +You should add the `top` property of `0` to `.background-buildings, .foreground-buildings`. ```js function eitherOr() { diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990f.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990f.md index d16084b615d..b0e6c9ac647 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990f.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990f.md @@ -7,7 +7,7 @@ dashedName: step-71 # --description-- -The windows are stacked on top of each other at the left of the section, behind the purple building. Add a new class below `.building-wrap` called `.window-wrap`, and add these properties to it: +The windows are stacked on top of each other at the left of the section, behind the purple building. Add a new class below `.building-wrap` called `window-wrap`, and add these properties to it: ```css display: flex;