Structure your content with a twelve-column system, powered by flexbox.
The following example creates three equal-width columns on tablet, desktop, and widescreen devices. Columns must have a
row as a parent.
Grid can be divided into 12 columns with size classes for each part from
is-12. In the following example we see the difference between
Create empty horizontal space from the left using
You can nest columns to have more flexibility in your design.
row 2 col 1
row 2 col 2
row 2 col 3
|To divide the grid into 12 columns
|If you want to change the size of a single column, you can use one of the following classes:
|To create horizontal space around column elements
|To take the space it needs, while the other column takes up the remaining space
Having troubles with the guide? Please give us more details and we'll get back to you soon.
Chat with the team