diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 76b5ec31df..7f498b0c55 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -757,31 +757,31 @@ pre code { clear: both; } -.row { +.row:before, +.row:after { + display: table; + content: " "; +} + +.row:after { + clear: both; +} + +.row:before, +.row:after { + display: table; + content: " "; +} + +.row:after { + clear: both; +} + +.row .row { margin-right: -15px; margin-left: -15px; } -.row:before, -.row:after { - display: table; - content: " "; -} - -.row:after { - clear: both; -} - -.row:before, -.row:after { - display: table; - content: " "; -} - -.row:after { - clear: both; -} - [class*="col-span-"] { position: relative; min-height: 1px; diff --git a/docs/examples/grid.html b/docs/examples/grid.html new file mode 100644 index 0000000000..f2028b8bfe --- /dev/null +++ b/docs/examples/grid.html @@ -0,0 +1,56 @@ +--- +layout: example +title: Grid template +--- + + + + + +
+ +

Bootstrap grids

+

Basic grid layouts to get you familiar with building within the Bootstrap grid system.

+ +

Three equal columns

+
+
.col-span-4
+
.col-span-4
+
.col-span-4
+
+ +

Three unequal columns

+
+
.col-span-3
+
.col-span-6
+
.col-span-3
+
+ +

Two columns

+
+
.col-span-8
+
.col-span-4
+
+ +

Full width, single column

+

No grid classes are necessary for full-width elements.

+ +
diff --git a/less/mixins.less b/less/mixins.less index b44197bccc..3f25b1b73f 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -407,11 +407,14 @@ // Creates a wrapper for a series of columns .make-row() { - // Negative margin the row out to align the content of columns - margin-left: (@grid-gutter-width / -2); - margin-right: (@grid-gutter-width / -2); // Then clear the floated columns .clearfix(); + + // Negative margin nested rows out to align the content of columns + .row { + margin-left: (@grid-gutter-width / -2); + margin-right: (@grid-gutter-width / -2); + } } // Generate the columns .make-column(@columns) {