Display content in a responsive, 12-column grid. [docs]
1/3, 2/3 columns on screen and tablet, two equal columns on mobile
[row class=\”row-demo\”]
[col medium=\”4\” small=\”6\”].medium-4.small-6.columns[/col]
[col medium=\”8\” small=\”6\”].medium-8.small-6.columns[/col]
[/row]
Two columns on screen and tablet, one column on mobile
[row class=\”row-demo\”]
[col large=\”3\” medium=\”6\”].large-3.medium-6.columns[/col]
[col large=\”3\” medium=\”6\”].large-3.medium-6.columns[/col]
[col large=\”3\” medium=\”6\”].large-3.medium-6.columns[/col]
[col large=\”3\” medium=\”6\”].large-3.medium-6.columns[/col]
[/row]
Three columns on screen and tablet, two columns on mobile
[row class=\”row-demo\”]
[col medium=\”3\” small=\”6\”].medium-3.small-6.columns[/col]
[col medium=\”3\” small=\”6\”].medium-3.small-6.columns[/col]
[col medium=\”6\” small=\”6\”].medium-6.small-12.columns[/col]
[/row]
Offset columns
[row class=\”row-demo\”]
[col large=\”9\” large_offset=\”3\”].large-9.large-offset-3.columns[/col]
[/row]
Nested columns
[row class=\”row-demo\”]
[col medium=\”6\”].medium-6[row_row][col_col medium=\”6\”].medium-6[/col_col][col_col medium=\”6\”].medium-6[/col_col][/row_row][/col]
[col medium=\”6\”].medium-6[row_row][col_col medium=\”6\”].medium-6[/col_col][col_col medium=\”6\”].medium-6[/col_col][/row_row][/col]
[/row]