Vertical Center
To align your columns vertically center, add the v-center modifier to the columns container.
<div class="columns v-center">
<div class="column">one</div>
<div class="column">two</div>
</div>Horizontal Center
To align your columns horizontal center, add the h-center modifier to the columns container.
<div class="columns h-center">
<div class="column">one</div>
<div class="column">two</div>
</div>Vertical and Horizontal Center
To align your columns vertically and horizontal center, add the vh-center modifier to the columns container.
<div class="columns vh-center">
<div class="column">one</div>
<div class="column">two</div>
</div>Column Gap - Space Between
<div class="columns space-between">
<div>one</div>
<div>two</div>
</div>