First column
Second column
Third column
Fourth column
First column
Second column
Third column
Fourth column
is-full
is-three-quarters
Auto
Auto
is-two-thirds
Auto
Auto
is-half
Auto
Auto
is-one-quarter
Auto
Auto
is-one-fifth
Auto
Auto
is-2
1
1
1
1
1
1
1
1
1
1
is-6
1
1
1
1
1
1
is-12
is-half
is-offset-one-quarter
is-three-fifths
is-offset-one-fifth
is-4
is-offset-8
is-11
is-offset-1
Narrow column
This column is only 200px wide.
Flexible column
This column will take up the remaining space available.
1
2
3
4
1
2
3
4
is-three-quarters-mobile
is-two-thirds-tablet
is-half-desktop
is-one-third-widescreen
is-one-quarter-fullhd
2
3
4
5
First column
First nested column
Second nested column
Second column
50%
Auto
Auto
Default gap
Default gap
Default gap
Default gap
First column
Second column
Third column
Fourth column
Column
Column
Column
Column
Column
Column
First column
Second column with more content. This is so you can see the vertical alignment.
is-one-quarter
is-one-quarter
is-one-quarter
is-one-quarter
is-half
is-one-quarter
is-one-quarter
is-one-quarter
Auto
is-half