diff --git a/dist/css/bootstrap.css.map b/dist/css/bootstrap.css.map index 39633de2d..673afe0e3 100644 Binary files a/dist/css/bootstrap.css.map and b/dist/css/bootstrap.css.map differ diff --git a/docs/dist/css/bootstrap.css.map b/docs/dist/css/bootstrap.css.map index 39633de2d..673afe0e3 100644 Binary files a/docs/dist/css/bootstrap.css.map and b/docs/dist/css/bootstrap.css.map differ diff --git a/less/grid.less b/less/grid.less index e100655b7..9957a44af 100644 --- a/less/grid.less +++ b/less/grid.less @@ -8,7 +8,7 @@ // Set the container width, and override it for fixed navbars in media queries. .container { - .container-fixed(); + .make-container(); @media (min-width: @screen-sm-min) { width: @container-sm; @@ -28,7 +28,7 @@ // width for fluid, full width layouts. .container-fluid { - .container-fixed(); + .make-container(); } diff --git a/less/mixins/grid.less b/less/mixins/grid.less index cae5eaff9..1353a7354 100644 --- a/less/mixins/grid.less +++ b/less/mixins/grid.less @@ -1,9 +1,9 @@ -// Grid system +/// Grid system // // Generate semantic grid columns with these mixins. // Centered container element -.container-fixed(@gutter: @grid-gutter-width) { +.make-container(@gutter: @grid-gutter-width) { margin-right: auto; margin-left: auto; padding-left: (@gutter / 2); @@ -18,105 +18,23 @@ &:extend(.clearfix all); } -// Generate the extra small columns -.make-xs-column(@columns; @gutter: @grid-gutter-width) { +.make-col(@gutter: @grid-gutter-width) { position: relative; float: left; - width: percentage((@columns / @grid-columns)); min-height: 1px; padding-left: (@gutter / 2); padding-right: (@gutter / 2); } -.make-xs-column-offset(@columns) { + +.make-col-span(@columns) { + width: percentage((@columns / @grid-columns)); +} +.make-col-offset(@columns) { margin-left: percentage((@columns / @grid-columns)); } -.make-xs-column-push(@columns) { +.make-col-push(@columns) { left: percentage((@columns / @grid-columns)); } -.make-xs-column-pull(@columns) { +.make-col-pull(@columns) { right: percentage((@columns / @grid-columns)); } - -// Generate the small columns -.make-sm-column(@columns; @gutter: @grid-gutter-width) { - position: relative; - min-height: 1px; - padding-left: (@gutter / 2); - padding-right: (@gutter / 2); - - @media (min-width: @screen-sm-min) { - float: left; - width: percentage((@columns / @grid-columns)); - } -} -.make-sm-column-offset(@columns) { - @media (min-width: @screen-sm-min) { - margin-left: percentage((@columns / @grid-columns)); - } -} -.make-sm-column-push(@columns) { - @media (min-width: @screen-sm-min) { - left: percentage((@columns / @grid-columns)); - } -} -.make-sm-column-pull(@columns) { - @media (min-width: @screen-sm-min) { - right: percentage((@columns / @grid-columns)); - } -} - -// Generate the medium columns -.make-md-column(@columns; @gutter: @grid-gutter-width) { - position: relative; - min-height: 1px; - padding-left: (@gutter / 2); - padding-right: (@gutter / 2); - - @media (min-width: @screen-md-min) { - float: left; - width: percentage((@columns / @grid-columns)); - } -} -.make-md-column-offset(@columns) { - @media (min-width: @screen-md-min) { - margin-left: percentage((@columns / @grid-columns)); - } -} -.make-md-column-push(@columns) { - @media (min-width: @screen-md-min) { - left: percentage((@columns / @grid-columns)); - } -} -.make-md-column-pull(@columns) { - @media (min-width: @screen-md-min) { - right: percentage((@columns / @grid-columns)); - } -} - -// Generate the large columns -.make-lg-column(@columns; @gutter: @grid-gutter-width) { - position: relative; - min-height: 1px; - padding-left: (@gutter / 2); - padding-right: (@gutter / 2); - - @media (min-width: @screen-lg-min) { - float: left; - width: percentage((@columns / @grid-columns)); - } -} -.make-lg-column-offset(@columns) { - @media (min-width: @screen-lg-min) { - margin-left: percentage((@columns / @grid-columns)); - } -} -.make-lg-column-push(@columns) { - @media (min-width: @screen-lg-min) { - left: percentage((@columns / @grid-columns)); - } -} -.make-lg-column-pull(@columns) { - @media (min-width: @screen-lg-min) { - right: percentage((@columns / @grid-columns)); - } -}