diff --git a/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/change-an-elements-relative-position.english.md b/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/change-an-elements-relative-position.english.md index c9f1790578..73d3f7e2d2 100644 --- a/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/change-an-elements-relative-position.english.md +++ b/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/change-an-elements-relative-position.english.md @@ -8,7 +8,7 @@ forumTopicId: 301044 ## Description
-CSS treats each HTML element as its own box, which is usually referred to as the CSS Box Model. Block-level items automatically start on a new line (think headings, paragraphs, and divs) while inline items sit within surrounding content (like images or spans). The default layout of elements in this way is called the normal flow of a document, but CSS offers the position property to override it. +CSS treats each HTML element as its own box, which is usually referred to as the CSS Box Model. Block-level items automatically start on a new line (think headings, paragraphs, and divs) while inline items sit within surrounding content (like images or spans). The default layout of elements in this way is called the normal flow of a document, but CSS offers the position property to override it. When the position of an element is set to relative, it allows you to specify how CSS should move it relative to its current position in the normal flow of the page. It pairs with the CSS offset properties of left or right, and top or bottom. These say how many pixels, percentages, or ems to move the item away from where it is normally positioned. The following example moves the paragraph 10 pixels away from the bottom: ```css diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-css/create-a-custom-css-variable.english.md b/curriculum/challenges/english/01-responsive-web-design/basic-css/create-a-custom-css-variable.english.md index 42dff2e4e4..81bfbd8d37 100644 --- a/curriculum/challenges/english/01-responsive-web-design/basic-css/create-a-custom-css-variable.english.md +++ b/curriculum/challenges/english/01-responsive-web-design/basic-css/create-a-custom-css-variable.english.md @@ -8,7 +8,7 @@ forumTopicId: 301086 ## Description
-To create a CSS variable, you just need to give it a name with two dashes in front of it and assign it a value like this: +To create a CSS variable, you just need to give it a name with two dashes in front of it and assign it a value like this: ```css --penguin-skin: gray; diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-css/override-class-declarations-with-inline-styles.english.md b/curriculum/challenges/english/01-responsive-web-design/basic-css/override-class-declarations-with-inline-styles.english.md index 86f59a6456..43e0707d3b 100644 --- a/curriculum/challenges/english/01-responsive-web-design/basic-css/override-class-declarations-with-inline-styles.english.md +++ b/curriculum/challenges/english/01-responsive-web-design/basic-css/override-class-declarations-with-inline-styles.english.md @@ -14,7 +14,7 @@ There are other ways that you can override CSS. Do you remember inline styles? ## Instructions
-Use an inline style to try to make our h1 element white. Remember, in line styles look like this: +Use an inline style to try to make our h1 element white. Remember, in line styles look like this: <h1 style="color: green;"> Leave the blue-text and pink-text classes on your h1 element.
diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element.english.md b/curriculum/challenges/english/01-responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element.english.md index 6d9a5e79b8..565ec4e833 100644 --- a/curriculum/challenges/english/01-responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element.english.md +++ b/curriculum/challenges/english/01-responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element.english.md @@ -16,7 +16,7 @@ These four values work like a clock: top, right, bottom, left, and will produce ## Instructions
-Use Clockwise Notation to give the element with the blue-box class a margin of 40px on its top and left side, but only 20px on its bottom and right side. +Use Clockwise Notation to give the element with the blue-box class a margin of 40px on its top and left side, but only 20px on its bottom and right side.
## Tests diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md b/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md index 1ae5625ec1..73235cf6e0 100644 --- a/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md +++ b/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md @@ -8,9 +8,9 @@ forumTopicId: 18349 ## Description
-With CSS, there are hundreds of CSS properties that you can use to change the way an element looks on your page. -When you entered <h2 style="color: red;">CatPhotoApp</h2>, you were styling that individual h2 element with inline CSS, which stands for Cascading Style Sheets. -That's one way to specify the style of an element, but there's a better way to apply CSS. +With CSS, there are hundreds of CSS properties that you can use to change the way an element looks on your page. +When you entered <h2 style="color: red;">CatPhotoApp</h2>, you were styling that individual h2 element with inline CSS, which stands for Cascading Style Sheets. +That's one way to specify the style of an element, but there's a better way to apply CSS. At the top of your code, create a style block like this: ```html @@ -18,7 +18,7 @@ At the top of your code, create a style block like this: ``` -Inside that style block, you can create a CSS selector for all h2 elements. For example, if you wanted all h2 elements to be red, you would add a style rule that looks like this: +Inside that style block, you can create a CSS selector for all h2 elements. For example, if you wanted all h2 elements to be red, you would add a style rule that looks like this: ```html