diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md
index d27e4b5c74..bb99a8c204 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md
@@ -22,19 +22,19 @@ Add the CSS property display: flex to all of the following items -
```yml
tests:
- - text: Your header should have a display property set to flex.
+ - text: Your header should have a display property set to flex.
testString: assert($('header').css('display') == 'flex');
- - text: Your footer should have a display property set to flex.
+ - text: Your footer should have a display property set to flex.
testString: assert($('footer').css('display') == 'flex');
- - text: Your h3 should have a display property set to flex.
+ - text: Your h3 should have a display property set to flex.
testString: assert($('h3').css('display') == 'flex');
- - text: Your h4 should have a display property set to flex.
+ - text: Your h4 should have a display property set to flex.
testString: assert($('h4').css('display') == 'flex');
- - text: Your .profile-name should have a display property set to flex.
+ - text: Your .profile-name should have a display property set to flex.
testString: assert($('.profile-name').css('display') == 'flex');
- - text: Your .follow-btn should have a display property set to flex.
+ - text: Your .follow-btn should have a display property set to flex.
testString: assert($('.follow-btn').css('display') == 'flex');
- - text: Your .stats should have a display property set to flex.
+ - text: Your .stats should have a display property set to flex.
testString: assert($('.stats').css('display') == 'flex');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-align-items-property.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-align-items-property.english.md
index 3580c05f9f..3e25e3c367 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-align-items-property.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-align-items-property.english.md
@@ -17,8 +17,8 @@ The different values available for align-items include:
## Instructions
-An example helps show this property in action. Add the CSS property align-items to the #box-container element, and give it a value of center.
-Bonus
Try the other options for the align-items property in the code editor to see their differences. But note that a value of center is the only one that will pass this challenge.
+An example helps show this property in action. Add the CSS property align-items to the #box-container element, and give it a value of center.
+Bonus
Try the other options for the align-items property in the code editor to see their differences. But note that a value of center is the only one that will pass this challenge.
## Tests
@@ -26,7 +26,7 @@ An example helps show this property in action. Add the CSS property align-
```yml
tests:
- - text: The #box-container element should have an align-items property set to a value of center.
+ - text: The #box-container element should have an align-items property set to a value of center.
testString: assert($('#box-container').css('align-items') == 'center');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.english.md
index bf97a66c42..6130db5bea 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.english.md
@@ -18,8 +18,8 @@ There are several options for how to space the flex items along the line that is
## Instructions
-An example helps show this property in action. Add the CSS property justify-content to the #box-container element, and give it a value of center.
-Bonus
Try the other options for the justify-content property in the code editor to see their differences. But note that a value of center is the only one that will pass this challenge.
+An example helps show this property in action. Add the CSS property justify-content to the #box-container element, and give it a value of center.
+Bonus
Try the other options for the justify-content property in the code editor to see their differences. But note that a value of center is the only one that will pass this challenge.
## Tests
@@ -27,7 +27,7 @@ An example helps show this property in action. Add the CSS property justif
```yml
tests:
- - text: The #box-container element should have a justify-content property set to a value of center.
+ - text: The #box-container element should have a justify-content property set to a value of center.
testString: assert($('#box-container').css('justify-content') == 'center');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes.english.md
index a896091f5b..3645af5543 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes.english.md
@@ -14,7 +14,7 @@ Placing the CSS property display: flex; on an element allows you to
## Instructions
-Add the CSS property display to #box-container and set its value to flex.
+Add the CSS property display to #box-container and set its value to flex.
## Tests
@@ -22,7 +22,7 @@ Add the CSS property display to #box-container and set
```yml
tests:
- - text: #box-container should have the display property set to a value of flex.
+ - text: #box-container should have the display property set to a value of flex.
testString: assert($('#box-container').css('display') == 'flex');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed.english.md
index 7534f072cb..6c54836856 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed.english.md
@@ -21,7 +21,7 @@ Add the CSS property align-items to the header's .follow-btn<
```yml
tests:
- - text: The .follow-btn element should have the align-items property set to a value of center.
+ - text: The .follow-btn element should have the align-items property set to a value of center.
testString: assert($('.follow-btn').css('align-items') == 'center');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-self-property.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-self-property.english.md
index 10a865df65..41f92920aa 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-self-property.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-align-self-property.english.md
@@ -14,7 +14,7 @@ The final property for flex items is align-self. This property allo
## Instructions
-Add the CSS property align-self to both #box-1 and #box-2. Give #box-1 a value of center and give #box-2 a value of flex-end.
+Add the CSS property align-self to both #box-1 and #box-2. Give #box-1 a value of center and give #box-2 a value of flex-end.
## Tests
@@ -22,9 +22,9 @@ Add the CSS property align-self to both #box-1 and #box-1 element should have the align-self property set to a value of center.
+ - text: The #box-1 element should have the align-self property set to a value of center.
testString: assert($('#box-1').css('align-self') == 'center');
- - text: The #box-2 element should have the align-self property set to a value of flex-end.
+ - text: The #box-2 element should have the align-self property set to a value of flex-end.
testString: assert($('#box-2').css('align-self') == 'flex-end');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items.english.md
index a144e1e849..85b5d37587 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items.english.md
@@ -9,12 +9,12 @@ forumTopicId: 301111
## Description
The opposite of flex-shrink is the flex-grow property. Recall that flex-shrink controls the size of the items when the container shrinks. The flex-grow property controls the size of items when the parent container expands.
-Using a similar example from the last challenge, if one item has a flex-grow value of 1 and the other has a flex-grow value of 3, the one with the value of 3 will grow three times as much as the other.
+Using a similar example from the last challenge, if one item has a flex-grow value of 1 and the other has a flex-grow value of 3, the one with the value of 3 will grow three times as much as the other.
## Instructions
-Add the CSS property flex-grow to both #box-1 and #box-2. Give #box-1 a value of 1 and #box-2 a value of 2.
+Add the CSS property flex-grow to both #box-1 and #box-2. Give #box-1 a value of 1 and #box-2 a value of 2.
## Tests
@@ -22,9 +22,9 @@ Add the CSS property flex-grow to both #box-1 and #box-1 element should have the flex-grow property set to a value of 1.
+ - text: The #box-1 element should have the flex-grow property set to a value of 1.
testString: assert($('#box-1').css('flex-grow') == '1');
- - text: The #box-2 element should have the flex-grow property set to a value of 2.
+ - text: The #box-2 element should have the flex-grow property set to a value of 2.
testString: assert($('#box-2').css('flex-grow') == '2');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shorthand-property.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shorthand-property.english.md
index 6d4a6637e6..011d5b9f95 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shorthand-property.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shorthand-property.english.md
@@ -15,7 +15,7 @@ The default property settings are flex: 0 1 auto;.
## Instructions
-Add the CSS property flex to both #box-1 and #box-2. Give #box-1 the values so its flex-grow is 2, its flex-shrink is 2, and its flex-basis is 150px. Give #box-2 the values so its flex-grow is 1, its flex-shrink is 1, and its flex-basis is 150px.
+Add the CSS property flex to both #box-1 and #box-2. Give #box-1 the values so its flex-grow is 2, its flex-shrink is 2, and its flex-basis is 150px. Give #box-2 the values so its flex-grow is 1, its flex-shrink is 1, and its flex-basis is 150px.
These values will cause #box-1 to grow to fill the extra space at twice the rate of #box-2 when the container is greater than 300px and shrink at twice the rate of #box-2 when the container is less than 300px. 300px is the combined size of the flex-basis values of the two boxes.
@@ -24,9 +24,9 @@ These values will cause #box-1 to grow to fill the extra space at t
```yml
tests:
- - text: The #box-1 element should have the flex property set to a value of 2 2 150px.
+ - text: The #box-1 element should have the flex property set to a value of 2 2 150px.
testString: assert($('#box-1').css('flex-grow') == '2' && $('#box-1').css('flex-shrink') == '2' && $('#box-1').css('flex-basis') == '150px');
- - text: The #box-2 element should have the flex property set to a value of 1 1 150px.
+ - text: The #box-2 element should have the flex property set to a value of 1 1 150px.
testString: assert($('#box-2').css('flex-grow') == '1' && $('#box-2').css('flex-shrink') == '1' && $('#box-2').css('flex-basis') == '150px');
- text: Your code should use the flex property for #box-1 and #box-2.
testString: assert(code.match(/flex:\s*?\d\s+?\d\s+?150px;/g).length == 2);
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items.english.md
index c985a88232..ac6a371304 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items.english.md
@@ -10,12 +10,12 @@ forumTopicId: 301113
So far, all the properties in the challenges apply to the flex container (the parent of the flex items). However, there are several useful properties for the flex items.
The first is the flex-shrink property. When it's used, it allows an item to shrink if the flex container is too small. Items shrink when the width of the parent container is smaller than the combined widths of all the flex items within it.
-The flex-shrink property takes numbers as values. The higher the number, the more it will shrink compared to the other items in the container. For example, if one item has a flex-shrink value of 1 and the other has a flex-shrink value of 3, the one with the value of 3 will shrink three times as much as the other.
+The flex-shrink property takes numbers as values. The higher the number, the more it will shrink compared to the other items in the container. For example, if one item has a flex-shrink value of 1 and the other has a flex-shrink value of 3, the one with the value of 3 will shrink three times as much as the other.
## Instructions
-Add the CSS property flex-shrink to both #box-1 and #box-2. Give #box-1 a value of 1 and #box-2 a value of 2.
+Add the CSS property flex-shrink to both #box-1 and #box-2. Give #box-1 a value of 1 and #box-2 a value of 2.
## Tests
@@ -23,9 +23,9 @@ Add the CSS property flex-shrink to both #box-1 and #box-1 element should have the flex-shrink property set to a value of 1.
+ - text: The #box-1 element should have the flex-shrink property set to a value of 1.
testString: assert($('#box-1').css('flex-shrink') == '1');
- - text: The #box-2 element should have the flex-shrink property set to a value of 2.
+ - text: The #box-2 element should have the flex-shrink property set to a value of 2.
testString: assert($('#box-2').css('flex-shrink') == '2');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column.english.md
index 16a1328c12..3fd8763d0e 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column.english.md
@@ -16,7 +16,7 @@ CSS also has options for the direction of the wrap:
## Instructions
-The current layout has too many boxes for one row. Add the CSS property flex-wrap to the #box-container element, and give it a value of wrap.
+The current layout has too many boxes for one row. Add the CSS property flex-wrap to the #box-container element, and give it a value of wrap.
## Tests
@@ -24,7 +24,7 @@ The current layout has too many boxes for one row. Add the CSS property fl
```yml
tests:
- - text: The #box-container element should have the flex-wrap property set to a value of wrap.
+ - text: The #box-container element should have the flex-wrap property set to a value of wrap.
testString: assert($('#box-container').css('flex-wrap') == 'wrap');
```
diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items.english.md
index b17f2eedcf..91fd977e07 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items.english.md
@@ -13,7 +13,7 @@ The order property is used to tell CSS the order of how flex items
## Instructions
-Add the CSS property order to both #box-1 and #box-2. Give #box-1 a value of 2 and give #box-2 a value of 1.
+Add the CSS property order to both #box-1 and #box-2. Give #box-1 a value of 2 and give #box-2 a value of 1.
## Tests
@@ -21,9 +21,9 @@ Add the CSS property order to both #box-1 and #b
```yml
tests:
- - text: The #box-1 element should have the order property set to a value of 2.
+ - text: The #box-1 element should have the order property set to a value of 2.
testString: assert($('#box-1').css('order') == '2');
- - text: The #box-2 element should have the order property set to a value of 1.
+ - text: The #box-2 element should have the order property set to a value of 1.
testString: assert($('#box-2').css('order') == '1');
```