Grid demos

Embedded grid

How to embed one grid in another without loosing alignment.

Custom names

How to customize the selectors for container, rows and columns in a grid.

Breakout

Breaking a columm-level element out to the borders of the grid.

Break columns

Columns breaking to span a different column amount on @media breakpoints.

Fitting blocks

Content blocks that change width to fit the window. Based on a 60 column grid to cater for 5, 4, 3, 2 and 1 columns.

Static grid

Simple 12 column static grid.

Fluid grid

12 column fluid grid with a minimum width set.