fix(challenge-md): Fix quotes that failed in the transform
This commit is contained in:
Bouncey
committed by
mrugesh mohapatra
mrugesh mohapatra
parent
392b28fa55
commit
a859035023
@ -22,19 +22,19 @@ Add the CSS property <code>display: flex</code> to all of the following items -
|
||||
```yml
|
||||
tests:
|
||||
- text: Your <code>header</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''header'').css(''display'') == ''flex'', ''Your <code>header</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($("header").css("display") == "flex", "Your <code>header</code> should have a <code>display</code> property set to flex.");'
|
||||
- text: Your <code>footer</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''footer'').css(''display'') == ''flex'', ''Your <code>footer</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($("footer").css("display") == "flex", "Your <code>footer</code> should have a <code>display</code> property set to flex.");'
|
||||
- text: Your <code>h3</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''h3'').css(''display'') == ''flex'', ''Your <code>h3</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($("h3").css("display") == "flex", "Your <code>h3</code> should have a <code>display</code> property set to flex.");'
|
||||
- text: Your <code>h4</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''h4'').css(''display'') == ''flex'', ''Your <code>h4</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($("h4").css("display") == "flex", "Your <code>h4</code> should have a <code>display</code> property set to flex.");'
|
||||
- text: Your <code>.profile-name</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''.profile-name'').css(''display'') == ''flex'', ''Your <code>.profile-name</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($(".profile-name").css("display") == "flex", "Your <code>.profile-name</code> should have a <code>display</code> property set to flex.");'
|
||||
- text: Your <code>.follow-btn</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''.follow-btn'').css(''display'') == ''flex'', ''Your <code>.follow-btn</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($(".follow-btn").css("display") == "flex", "Your <code>.follow-btn</code> should have a <code>display</code> property set to flex.");'
|
||||
- text: Your <code>.stats</code> should have a <code>display</code> property set to flex.
|
||||
testString: 'assert($(''.stats'').css(''display'') == ''flex'', ''Your <code>.stats</code> should have a <code>display</code> property set to flex.'');'
|
||||
testString: 'assert($(".stats").css("display") == "flex", "Your <code>.stats</code> should have a <code>display</code> property set to flex.");'
|
||||
|
||||
```
|
||||
|
||||
@ -51,7 +51,7 @@ tests:
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
header {
|
||||
|
||||
|
||||
}
|
||||
header .profile-thumbnail {
|
||||
width: 50px;
|
||||
@ -59,11 +59,11 @@ tests:
|
||||
border-radius: 4px;
|
||||
}
|
||||
header .profile-name {
|
||||
|
||||
|
||||
margin-left: 10px;
|
||||
}
|
||||
header .follow-btn {
|
||||
|
||||
|
||||
margin: 0 0 0 auto;
|
||||
}
|
||||
header .follow-btn button {
|
||||
@ -72,7 +72,7 @@ tests:
|
||||
padding: 5px;
|
||||
}
|
||||
header h3, header h4 {
|
||||
|
||||
|
||||
margin: 0;
|
||||
}
|
||||
#inner p {
|
||||
@ -85,10 +85,10 @@ tests:
|
||||
opacity: 0.1;
|
||||
}
|
||||
footer {
|
||||
|
||||
|
||||
}
|
||||
footer .stats {
|
||||
|
||||
|
||||
font-size: 15px;
|
||||
}
|
||||
footer .stats strong {
|
||||
|
||||
@ -26,7 +26,7 @@ An example helps show this property in action. Add the CSS property <code>align-
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-container</code> element should have an <code>align-items</code> property set to a value of center.'
|
||||
testString: 'assert($(''#box-container'').css(''align-items'') == ''center'', ''The <code>#box-container</code> element should have an <code>align-items</code> property set to a value of center.'');'
|
||||
testString: 'assert($("#box-container").css("align-items") == "center", "The <code>#box-container</code> element should have an <code>align-items</code> property set to a value of center.");'
|
||||
|
||||
```
|
||||
|
||||
@ -43,7 +43,7 @@ tests:
|
||||
background: gray;
|
||||
display: flex;
|
||||
height: 500px;
|
||||
|
||||
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
@ -26,7 +26,7 @@ An example helps show this property in action. Add the CSS property <code>justif
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-container</code> element should have a <code>justify-content</code> property set to a value of center.'
|
||||
testString: 'assert($(''#box-container'').css(''justify-content'') == ''center'', ''The <code>#box-container</code> element should have a <code>justify-content</code> property set to a value of center.'');'
|
||||
testString: 'assert($("#box-container").css("justify-content") == "center", "The <code>#box-container</code> element should have a <code>justify-content</code> property set to a value of center.");'
|
||||
|
||||
```
|
||||
|
||||
@ -43,7 +43,7 @@ tests:
|
||||
background: gray;
|
||||
display: flex;
|
||||
height: 500px;
|
||||
|
||||
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
@ -21,7 +21,7 @@ Add the CSS property <code>flex-direction</code> to the header's <code>.profile-
|
||||
```yml
|
||||
tests:
|
||||
- text: The <code>.profile-name</code> element should have a <code>flex-direction</code> property set to column.
|
||||
testString: 'assert($(''.profile-name'').css(''flex-direction'') == ''column'', ''The <code>.profile-name</code> element should have a <code>flex-direction</code> property set to column.'');'
|
||||
testString: 'assert($(".profile-name").css("flex-direction") == "column", "The <code>.profile-name</code> element should have a <code>flex-direction</code> property set to column.");'
|
||||
|
||||
```
|
||||
|
||||
@ -48,7 +48,7 @@ tests:
|
||||
}
|
||||
header .profile-name {
|
||||
display: flex;
|
||||
|
||||
|
||||
margin-left: 10px;
|
||||
}
|
||||
header .follow-btn {
|
||||
|
||||
@ -21,9 +21,9 @@ Add the CSS property <code>flex-direction</code> to both the <code>header</code>
|
||||
```yml
|
||||
tests:
|
||||
- text: The <code>header</code> should have a <code>flex-direction</code> property set to row.
|
||||
testString: 'assert(code.match(/header\s*?{[^}]*?flex-direction:\s*?row;/g), ''The <code>header</code> should have a <code>flex-direction</code> property set to row.'');'
|
||||
testString: 'assert(code.match(/header\s*?{[^}]*?flex-direction:\s*?row;/g), "The <code>header</code> should have a <code>flex-direction</code> property set to row.");'
|
||||
- text: The <code>footer</code> should have a <code>flex-direction</code> property set to row.
|
||||
testString: 'assert(code.match(/footer\s*?{[^}]*?flex-direction:\s*?row;/g), ''The <code>footer</code> should have a <code>flex-direction</code> property set to row.'');'
|
||||
testString: 'assert(code.match(/footer\s*?{[^}]*?flex-direction:\s*?row;/g), "The <code>footer</code> should have a <code>flex-direction</code> property set to row.");'
|
||||
|
||||
```
|
||||
|
||||
@ -41,7 +41,7 @@ tests:
|
||||
}
|
||||
header {
|
||||
display: flex;
|
||||
|
||||
|
||||
}
|
||||
header .profile-thumbnail {
|
||||
width: 50px;
|
||||
@ -76,7 +76,7 @@ tests:
|
||||
}
|
||||
footer {
|
||||
display: flex;
|
||||
|
||||
|
||||
}
|
||||
footer .stats {
|
||||
display: flex;
|
||||
|
||||
@ -22,7 +22,7 @@ Add the CSS property <code>display</code> to <code>#box-container</code> and set
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>#box-container</code> should have the <code>display</code> property set to a value of flex.'
|
||||
testString: 'assert($(''#box-container'').css(''display'') == ''flex'', ''<code>#box-container</code> should have the <code>display</code> property set to a value of flex.'');'
|
||||
testString: 'assert($("#box-container").css("display") == "flex", "<code>#box-container</code> should have the <code>display</code> property set to a value of flex.");'
|
||||
|
||||
```
|
||||
|
||||
@ -37,21 +37,21 @@ tests:
|
||||
<style>
|
||||
#box-container {
|
||||
height: 500px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
<div id="box-container">
|
||||
|
||||
@ -21,7 +21,7 @@ Add the CSS property <code>align-items</code> to the header's <code>.follow-btn<
|
||||
```yml
|
||||
tests:
|
||||
- text: The <code>.follow-btn</code> element should have the <code>align-items</code> property set to a value of center.
|
||||
testString: 'assert($(''.follow-btn'').css(''align-items'') == ''center'', ''The <code>.follow-btn</code> element should have the <code>align-items</code> property set to a value of center.'');'
|
||||
testString: 'assert($(".follow-btn").css("align-items") == "center", "The <code>.follow-btn</code> element should have the <code>align-items</code> property set to a value of center.");'
|
||||
|
||||
```
|
||||
|
||||
@ -54,7 +54,7 @@ tests:
|
||||
}
|
||||
header .follow-btn {
|
||||
display: flex;
|
||||
|
||||
|
||||
margin: 0 0 0 auto;
|
||||
}
|
||||
header .follow-btn button {
|
||||
@ -64,7 +64,7 @@ tests:
|
||||
}
|
||||
header h3, header h4 {
|
||||
display: flex;
|
||||
|
||||
|
||||
margin: 0;
|
||||
}
|
||||
#inner p {
|
||||
|
||||
@ -22,9 +22,9 @@ Add the CSS property <code>align-self</code> to both <code>#box-1</code> and <co
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-1</code> element should have the <code>align-self</code> property set to a value of center.'
|
||||
testString: 'assert($(''#box-1'').css(''align-self'') == ''center'', ''The <code>#box-1</code> element should have the <code>align-self</code> property set to a value of center.'');'
|
||||
testString: 'assert($("#box-1").css("align-self") == "center", "The <code>#box-1</code> element should have the <code>align-self</code> property set to a value of center.");'
|
||||
- text: 'The <code>#box-2</code> element should have the <code>align-self</code> property set to a value of flex-end.'
|
||||
testString: 'assert($(''#box-2'').css(''align-self'') == ''flex-end'', ''The <code>#box-2</code> element should have the <code>align-self</code> property set to a value of flex-end.'');'
|
||||
testString: 'assert($("#box-2").css("align-self") == "flex-end", "The <code>#box-2</code> element should have the <code>align-self</code> property set to a value of flex-end.");'
|
||||
|
||||
```
|
||||
|
||||
@ -43,14 +43,14 @@ tests:
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
|
||||
height: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
|
||||
|
||||
height: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
@ -22,13 +22,13 @@ Set the initial size of the boxes using <code>flex-basis</code>. Add the CSS pro
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-1</code> element should have a <code>flex-basis</code> property.'
|
||||
testString: 'assert($(''#box-1'').css(''flex-basis'') != ''auto'', ''The <code>#box-1</code> element should have a <code>flex-basis</code> property.'');'
|
||||
testString: 'assert($("#box-1").css("flex-basis") != "auto", "The <code>#box-1</code> element should have a <code>flex-basis</code> property.");'
|
||||
- text: 'The <code>#box-1</code> element should have a <code>flex-basis</code> value of <code>10em</code>.'
|
||||
testString: 'assert(code.match(/#box-1\s*?{\s*?.*?\s*?.*?\s*?flex-basis:\s*?10em;/g), ''The <code>#box-1</code> element should have a <code>flex-basis</code> value of <code>10em</code>.'');'
|
||||
testString: 'assert(code.match(/#box-1\s*?{\s*?.*?\s*?.*?\s*?flex-basis:\s*?10em;/g), "The <code>#box-1</code> element should have a <code>flex-basis</code> value of <code>10em</code>.");'
|
||||
- text: 'The <code>#box-2</code> element should have the <code>flex-basis</code> property.'
|
||||
testString: 'assert($(''#box-2'').css(''flex-basis'') != ''auto'', ''The <code>#box-2</code> element should have the <code>flex-basis</code> property.'');'
|
||||
testString: 'assert($("#box-2").css("flex-basis") != "auto", "The <code>#box-2</code> element should have the <code>flex-basis</code> property.");'
|
||||
- text: 'The <code>#box-2</code> element should have a <code>flex-basis</code> value of <code>20em</code>.'
|
||||
testString: 'assert(code.match(/#box-2\s*?{\s*?.*?\s*?.*?\s*?flex-basis:\s*?20em;/g), ''The <code>#box-2</code> element should have a <code>flex-basis</code> value of <code>20em</code>.'');'
|
||||
testString: 'assert(code.match(/#box-2\s*?{\s*?.*?\s*?.*?\s*?flex-basis:\s*?20em;/g), "The <code>#box-2</code> element should have a <code>flex-basis</code> value of <code>20em</code>.");'
|
||||
|
||||
```
|
||||
|
||||
@ -45,20 +45,20 @@ tests:
|
||||
display: flex;
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
height: 200px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
height: 200px;
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<div id="box-container">
|
||||
<div id="box-1"></div>
|
||||
<div id="box-2"></div>
|
||||
|
||||
@ -21,7 +21,7 @@ Add the CSS property <code>flex-direction</code> to the <code>#box-container</co
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-container</code> element should have a <code>flex-direction</code> property set to column.'
|
||||
testString: 'assert($(''#box-container'').css(''flex-direction'') == ''column'', ''The <code>#box-container</code> element should have a <code>flex-direction</code> property set to column.'');'
|
||||
testString: 'assert($("#box-container").css("flex-direction") == "column", "The <code>#box-container</code> element should have a <code>flex-direction</code> property set to column.");'
|
||||
|
||||
```
|
||||
|
||||
@ -37,7 +37,7 @@ tests:
|
||||
#box-container {
|
||||
display: flex;
|
||||
height: 500px;
|
||||
|
||||
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
@ -23,7 +23,7 @@ Add the CSS property <code>flex-direction</code> to the <code>#box-container</co
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-container</code> element should have a <code>flex-direction</code> property set to row-reverse.'
|
||||
testString: 'assert($(''#box-container'').css(''flex-direction'') == ''row-reverse'', ''The <code>#box-container</code> element should have a <code>flex-direction</code> property set to row-reverse.'');'
|
||||
testString: 'assert($("#box-container").css("flex-direction") == "row-reverse", "The <code>#box-container</code> element should have a <code>flex-direction</code> property set to row-reverse.");'
|
||||
|
||||
```
|
||||
|
||||
@ -39,7 +39,7 @@ tests:
|
||||
#box-container {
|
||||
display: flex;
|
||||
height: 500px;
|
||||
|
||||
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
@ -22,9 +22,9 @@ Add the CSS property <code>flex-grow</code> to both <code>#box-1</code> and <cod
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-1</code> element should have the <code>flex-grow</code> property set to a value of 1.'
|
||||
testString: 'assert($(''#box-1'').css(''flex-grow'') == ''1'', ''The <code>#box-1</code> element should have the <code>flex-grow</code> property set to a value of 1.'');'
|
||||
testString: 'assert($("#box-1").css("flex-grow") == "1", "The <code>#box-1</code> element should have the <code>flex-grow</code> property set to a value of 1.");'
|
||||
- text: 'The <code>#box-2</code> element should have the <code>flex-grow</code> property set to a value of 2.'
|
||||
testString: 'assert($(''#box-2'').css(''flex-grow'') == ''2'', ''The <code>#box-2</code> element should have the <code>flex-grow</code> property set to a value of 2.'');'
|
||||
testString: 'assert($("#box-2").css("flex-grow") == "2", "The <code>#box-2</code> element should have the <code>flex-grow</code> property set to a value of 2.");'
|
||||
|
||||
```
|
||||
|
||||
@ -41,17 +41,17 @@ tests:
|
||||
display: flex;
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
height: 200px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
height: 200px;
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@ -24,11 +24,11 @@ These values will cause <code>#box-1</code> to grow to fill the extra space at t
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-1</code> element should have the <code>flex</code> 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'', ''The <code>#box-1</code> element should have the <code>flex</code> 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", "The <code>#box-1</code> element should have the <code>flex</code> property set to a value of 2 2 150px.");'
|
||||
- text: 'The <code>#box-2</code> element should have the <code>flex</code> 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'', ''The <code>#box-2</code> element should have the <code>flex</code> 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", "The <code>#box-2</code> element should have the <code>flex</code> property set to a value of 1 1 150px.");'
|
||||
- text: 'Your code should use the <code>flex</code> property for <code>#box-1</code> and <code>#box-2</code>.'
|
||||
testString: 'assert(code.match(/flex:\s*?\d\s+?\d\s+?150px;/g).length == 2, ''Your code should use the <code>flex</code> property for <code>#box-1</code> and <code>#box-2</code>.'');'
|
||||
testString: 'assert(code.match(/flex:\s*?\d\s+?\d\s+?150px;/g).length == 2, "Your code should use the <code>flex</code> property for <code>#box-1</code> and <code>#box-2</code>.");'
|
||||
|
||||
```
|
||||
|
||||
@ -47,13 +47,13 @@ tests:
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
|
||||
|
||||
height: 200px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -23,9 +23,9 @@ Add the CSS property <code>flex-shrink</code> to both <code>#box-1</code> and <c
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-1</code> element should have the <code>flex-shrink</code> property set to a value of 1.'
|
||||
testString: 'assert($(''#box-1'').css(''flex-shrink'') == ''1'', ''The <code>#box-1</code> element should have the <code>flex-shrink</code> property set to a value of 1.'');'
|
||||
testString: 'assert($("#box-1").css("flex-shrink") == "1", "The <code>#box-1</code> element should have the <code>flex-shrink</code> property set to a value of 1.");'
|
||||
- text: 'The <code>#box-2</code> element should have the <code>flex-shrink</code> property set to a value of 2.'
|
||||
testString: 'assert($(''#box-2'').css(''flex-shrink'') == ''2'', ''The <code>#box-2</code> element should have the <code>flex-shrink</code> property set to a value of 2.'');'
|
||||
testString: 'assert($("#box-2").css("flex-shrink") == "2", "The <code>#box-2</code> element should have the <code>flex-shrink</code> property set to a value of 2.");'
|
||||
|
||||
```
|
||||
|
||||
@ -46,14 +46,14 @@ tests:
|
||||
background-color: dodgerblue;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@ -24,7 +24,7 @@ The current layout has too many boxes for one row. Add the CSS property <code>fl
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-container</code> element should have the <code>flex-wrap</code> property set to a value of wrap.'
|
||||
testString: 'assert($(''#box-container'').css(''flex-wrap'') == ''wrap'', ''The <code>#box-container</code> element should have the <code>flex-wrap</code> property set to a value of wrap.'');'
|
||||
testString: 'assert($("#box-container").css("flex-wrap") == "wrap", "The <code>#box-container</code> element should have the <code>flex-wrap</code> property set to a value of wrap.");'
|
||||
|
||||
```
|
||||
|
||||
@ -41,7 +41,7 @@ tests:
|
||||
background: gray;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
|
||||
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
@ -21,7 +21,7 @@ Add the CSS property <code>justify-content</code> to the header's <code>.profile
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>.profile-name</code> element should have the <code>justify-content</code> property set to any of these values: center, flex-start, flex-end, space-between, or space-around.'
|
||||
testString: 'assert(code.match(/header\s.profile-name\s*{\s*?.*?\s*?.*?\s*?\s*?.*?\s*?justify-content\s*:\s*(center|flex-start|flex-end|space-between|space-around)\s*;/g), ''The <code>.profile-name</code> element should have the <code>justify-content</code> property set to any of these values: center, flex-start, flex-end, space-between, or space-around.'');'
|
||||
testString: 'assert(code.match(/header\s.profile-name\s*{\s*?.*?\s*?.*?\s*?\s*?.*?\s*?justify-content\s*:\s*(center|flex-start|flex-end|space-between|space-around)\s*;/g), "The <code>.profile-name</code> element should have the <code>justify-content</code> property set to any of these values: center, flex-start, flex-end, space-between, or space-around.");'
|
||||
|
||||
```
|
||||
|
||||
@ -49,7 +49,7 @@ tests:
|
||||
header .profile-name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
||||
margin-left: 10px;
|
||||
}
|
||||
header .follow-btn {
|
||||
|
||||
@ -21,9 +21,9 @@ Add the CSS property <code>order</code> to both <code>#box-1</code> and <code>#b
|
||||
```yml
|
||||
tests:
|
||||
- text: 'The <code>#box-1</code> element should have the <code>order</code> property set to a value of 2.'
|
||||
testString: 'assert($(''#box-1'').css(''order'') == ''2'', ''The <code>#box-1</code> element should have the <code>order</code> property set to a value of 2.'');'
|
||||
testString: 'assert($("#box-1").css("order") == "2", "The <code>#box-1</code> element should have the <code>order</code> property set to a value of 2.");'
|
||||
- text: 'The <code>#box-2</code> element should have the <code>order</code> property set to a value of 1.'
|
||||
testString: 'assert($(''#box-2'').css(''order'') == ''1'', ''The <code>#box-2</code> element should have the <code>order</code> property set to a value of 1.'');'
|
||||
testString: 'assert($("#box-2").css("order") == "1", "The <code>#box-2</code> element should have the <code>order</code> property set to a value of 1.");'
|
||||
|
||||
```
|
||||
|
||||
@ -42,14 +42,14 @@ tests:
|
||||
}
|
||||
#box-1 {
|
||||
background-color: dodgerblue;
|
||||
|
||||
|
||||
height: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
#box-2 {
|
||||
background-color: orangered;
|
||||
|
||||
|
||||
height: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user