gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

removed flex-basis from flex-grow challenge (#13947)

Browse Source
This commit is contained in:
cdrainxv
2017-03-17 13:48:40 -06:00
committed by Heather K
parent 179da995c5
commit 59c543e7b4
1 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
seed/challenges/01-responsive-web-design/css-flexbox.json
View File

@ -942,16 +942,15 @@
" display: flex;",
" height: 500px;",
" }",
" ",
" #box-1 {",
" background-color: dodgerblue;",
" flex-basis: 10em; /* See next challenge! */",
" height: 200px;",
" ",
" }",
"",
" ",
" #box-2 {",
" background-color: orangered;",
" flex-basis: 10em; /* See next challenge! */",
" height: 200px;",
" ",
" }",
@ -977,10 +976,10 @@
"id": "587d78ae367417b2b2512afd",
"title": "Use the flex-basis Property to Set the Initial Size of an Item",
"description": [
"The previous example included <code>flex-basis</code> to help demonstrate how the <code>flex-grow</code> property works. The <code>flex-basis</code> property specifies the initial size of the item before CSS makes adjustments with <code>flex-shrink</code> or <code>flex-grow</code>.",
"The <code>flex-basis</code> property specifies the initial size of the item before CSS makes adjustments with <code>flex-shrink</code> or <code>flex-grow</code>.",
"The units used by the <code>flex-basis</code> property are the same as other size properties (<code>px</code>, <code>em</code>, <code>%</code>, etc.). The value <code>auto</code> sizes items based on the content.",
"<hr>",
"Set the initial size of the boxes using <code>flex-basis</code>. Add the CSS property <code>flex-basis</code> to both <code>#box-1</code> and <code>#box-2</code>. Give <code>#box-1</code> a value of 10em and <code>#box-2</code> a value of 20em."
"Set the initial size of the boxes using <code>flex-basis</code>. Add the CSS property <code>flex-basis</code> to both <code>#box-1</code> and <code>#box-2</code>. Give <code>#box-1</code> a value of <code>10em</code> and <code>#box-2</code> a value of <code>20em</code>."
],
"challengeSeed": [
"<style>",
@ -988,19 +987,20 @@
" 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>",
@ -1008,9 +1008,9 @@
],
"tests": [
"assert($('#box-1').css('flex-basis') != 'auto', 'message: The <code>#box-1</code> element should have a <code>flex-basis</code> property.');",
"assert(code.match(/#box-1\\s*?{\\s*?.*?\\s*?.*?\\s*?flex-basis:\\s*?10em;/g), 'message: The <code>#box-1</code> element should have a <code>flex-basis</code> value of 10em.');",
"assert(code.match(/#box-1\\s*?{\\s*?.*?\\s*?.*?\\s*?flex-basis:\\s*?10em;/g), 'message: The <code>#box-1</code> element should have a <code>flex-basis</code> value of <code>10em</code>.');",
"assert($('#box-2').css('flex-basis') != 'auto', 'message: The <code>#box-2</code> element should have the <code>flex-basis</code> property.');",
"assert(code.match(/#box-2\\s*?{\\s*?.*?\\s*?.*?\\s*?flex-basis:\\s*?20em;/g), 'message: The <code>#box-2</code> element should have a <code>flex-basis</code> value of 20em.');"
"assert(code.match(/#box-2\\s*?{\\s*?.*?\\s*?.*?\\s*?flex-basis:\\s*?20em;/g), 'message: The <code>#box-2</code> element should have a <code>flex-basis</code> value of <code>20em</code>.');"
],
"solutions": [],
"hints": [],