responsiveness
By default, columns are only activated from
tablet onwards. This means columns are stacked on top of each other on
mobile.
If you want columns to work on
mobile too, just add the is-mobile modifier on the columns container:
1
2
3
4
<div class="columns is-mobile">
<div class="column">1</div>
<div class="column">2</div>
<div class="column">3</div>
<div class="column">4</div>
</div>
If you
only want columns on
desktop upwards, just use the is-desktop modifier on the columns container:
1
2
3
4
<div class="columns is-desktop">
<div class="column">1</div>
<div class="column">2</div>
<div class="column">3</div>
<div class="column">4</div>
</div>
