Design Guide - Grid
This is the grid that powers our website.
Options:
Fill empty columns:
.row-fill-empty-columns
Keep proportions:
.row-keep-proportions
Minimum two columns:
.row-min-two-columns
One column on lg:
.row-one-column--lg
One column on md:
.row-one-column--md
One column on sm:
.row-one-column--sm
Increase gutter:
.row-gutter-lg
Reduce gutter:
.row-gutter-sm
No gutter:
.row-gutter-none
1/2
Default:
1/2
1/2
Multiple rows:
1/2
1/2
1/2
1/2
Uneven rows:
1/2
1/2
1/2
1/2
1/3
Default:
1/3
1/3
1/3
Multiple rows:
1/3
1/3
1/3
1/3
1/3
1/3
Uneven rows:
1/3
1/3
1/3
1/3
1/3
1/3
1/3
1/3
1/3
1/3
1/3
1/3
Uneven columns:
2/3
1/3
1/3
2/3
1/4
Default:
1/4
1/4
1/4
1/4
Multiple rows:
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
Uneven rows:
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
1/4
Uneven columns:
2/4
1/4
1/4
1/4
2/4
1/4
1/4
1/4
2/4
3/4
1/4
1/4
3/4
1/5
Default:
1/5
1/5
1/5
1/5
1/5
Multiple rows:
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
Uneven rows:
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
1/5
Uneven columns:
2/5
1/5
1/5
1/5
1/5
2/5
1/5
1/5
1/5
1/5
2/5
1/5
1/5
1/5
1/5
2/5
3/5
1/5
1/5
1/5
3/5
1/5
1/5
1/5
3/5
4/5
1/5
1/5
4/5