Layout Grids allow you to align elements into columns and rows.
COLUMNS WITH GUTTER
50%
50%
25%
25%
25%
25%
33%
33%
33%
20%
20%
20%
20%
20%
33%
66%
25%
25%
50%
75%
25%
80%
20%
NO GUTTER BETWEEN COLUMNS
50%
50%
25%
25%
25%
25%
33%
33%
33%
20%
20%
20%
20%
20%
33%
66%
25%
25%
50%
75%
25%
80%
20%
NESTED GRID
50%
50%
50%
50%
33%
66%
RESPONSIVE GRID
Grid cells have different size on Phone & Tablet.
.col-100.tablet-50
.col-100.tablet-50
.col-50.tablet-25
.col-50.tablet-25
.col-50.tablet-25
.col-50.tablet-25
.col-100.tablet-40
.col-50.tablet-60
.col-50.tablet-66
.col-100.tablet-33
COLUMNS WITH EQUAL WIDTH
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto
.col-auto