Columns Layouts

One Column

Two Columns

Three Columns

Four Columns

Five Columns

Six Columns

Column Grids

Apply the .cols-grid class to a .cols-x block to make every column the same height and assure the elements within each column stretch to fill the column's space.

Fancy Columns

A few examples of combining boxes and helper classes with columns layouts to produce interesting layout effects.
Back to top