Columns

Columns are extremely flexible with responsive version.

Features

• Align to Grid
• Standalone
• Use on content

The job of the column classes is to align items to Bootstrap's 12 column grid.

You can use them without the row classes as well and with other classes like the margin or padding classes.

You can even use them on content so if you have an image that you want to occupy a certain number of columns, you can add one of the column classes there as well.

Column Options

• col{-BR}-{SIZ}
  • BR:
    sm md lg xl xxl
  • SIZ:
    1 2 3 4 5 6 7 8 9 10 11 12

Try it

Besides the automatic col class, you can specify a breakpoint as well as the number of columns that content should try to take.

The column quantities should add to 12, if they run over, then the columns will wrap to another line.

Reordering

• order{-BR}-{ORD}
  • BR:
    sm md lg xl xxl
  • ORD:
    1 2 3 4 5

Try it

You can reorder columns using responsive order classes.

Offsetting

• offset{-BR}-{POS}
  • BR:
    sm md lg xl xxl
  • POS:
    1 2 3 4 5 6 7 8 9 10 11

Try it

You can offset a column by a column width by using the offset classes.