Improves 'Use the Bootstrap Grid to Put Elements Side By Side'

This commit is contained in:
LumenTeun
2015-05-31 18:27:53 +02:00
parent 3a84d48cec
commit b1f7c215e4

View File

@ -602,7 +602,7 @@
"name": "Waypoint: Use the Bootstrap Grid to Put Elements Side By Side",
"difficulty": 0.054,
"description": [
"Put the \"like\", \"Info\" and \"Delete\" buttons side-by-side by wrapping all three of them within one <code>&#60;div class=\"row\"&#62;</code> element, then each of them within a <code>&#60;div class=\"col-xs-4\"&#62;</code> element.",
"Put the \"Like\", \"Info\" and \"Delete\" buttons side-by-side by wrapping all three of them within one <code>&#60;div class=\"row\"&#62;</code> element, then each of them within a <code>&#60;div class=\"col-xs-4\"&#62;</code> element.",
"Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
"<a href='http://getbootstrap.com/css/#grid-example-basic' target='_blank'><img class='img-responsive' src='https://www.evernote.com/l/AHTwlE2XCLhGFYJzoye_QfsF3ho6y87via4B/image.png'></a>",
@ -611,8 +611,8 @@
"The <code>row</code> class is applied to a <code>div</code>, and the buttons themselves can be wrapped within it."
],
"tests": [
"assert($('.row').length > 0, 'Your new button should be wrapped within a div with the class \"row\".')",
"assert($('.col-xs-4').length > 2, 'Each of your bootstrap buttons should be wrapped in a div with the class \"col-xs-4\".')"
"assert($('div.row:has(button)').length > 0, 'Your buttons should be wrapped within a div with the class \"row\".')",
"assert($('div.col-xs-4').length > 2, 'Each of your Bootstrap buttons should be wrapped in a div with the class \"col-xs-4\".')"
],
"challengeSeed": [
"<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>",