Flexbox Grid
The flexbox grid provided is a 12 column grid. You may specify the columns at various breakpoints and spreads. Offsets are also available to position your element exactly where you want it. Flex Grids offer much needed flexibility when it comes to layout and composition.
Specify a size (resize browser for demo):
.col-xs-12
.col-sm-6
.col-md-4
.col-lg-3
.col-xs-12
.col-sm-6
.col-md-4
.col-lg-3
.col-sm-12
.col-md-4
.col-lg-3
.col-md-6
.col-lg-3
.col-md-6
.col-lg-6
.col-lg-6
Use an offset:
.col-sm-5
.col-sm-offset-2
.col
Code Example:
<!-- Specified Sizing -->
<div class="row">
<div class="col col-sm-2"></div>
<div class="col col-sm-6"></div>
<div class="col col-sm-4"></div>
</div>
<!-- Offsets -->
<div class="row">
<div class="col col-sm-5"></div>
<div class="col col-sm-5 col-sm-offset-2"></div>
</div>