Grid

Breakpoints:

-xs- [576px] -sm- [768px] -md- [992px] -lg- [1200px] -xl-

Grid uses CSS flexbox for rows and columns.

Grid with equal height columns. Pure CSS, no JavaScript used.

.fx-col .fx-col--3 - 3/12 = 25%
.fx-padding-all - adds inner padding
.fx-col .fx-col--6 - 6/12 = 50%
.fx-col .fx-col--3 - 3/12 = 25%

Grid - responsive

Browsers support

.fx-col .fx-col--2
.fx-padding-all - adds inner padding
.fx-col .fx-col--2
.fx-col .fx-col--8

Grid vertical alignment. Pure CSS, no JavaScript used.

A lot of text
A lot of text
A lot of text
A lot of text
A lot of text
A lot of text
.fx-col-sm-align-top - align to top
.fx-col-sm-align-middle - align to middle
.fx-col-sm-align-bottom - align to bottom
1 line of text