Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases.
Using a single set of
.col-md-* grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns in any
Move columns to the right using
.col-md-offset-* classes. These classes increase the left margin of a column by
* columns. For example,
.col-md-4 over four columns.
Easily change the order of our built-in grid columns with
.col-md-pull-* modifier classes.
See this in action on this template's Features page!