Layout & Grid

A flexbox-based grid system using .row and .column. Columns stack on mobile automatically. Use grow-2 through grow-6 for proportional sizing.

Equal columns

1x
1x
1x
1x
1x

Proportional sizing

1x
2x
1x
1x
3x
2x

Grid code

Cards

The .card class wraps any content in a contained section with padding, background and shadow. Combine with .row and .column for layout.

With header
Body content
Footer
.card-flat
.card-bordered
.card-hover

Card code