I've been able to get around it by entering an empty grid item, but it seems like a hack to enter empty space to push over other grid items. The idea is to use the middle four grid items so the data is centered (in a 12 column setup.)
This works, is it the right way to go?
<div class="grid">
<div class="size-1-4"></div>
<div class="size-1-8>A</div>
<div class="size-1-8>B</div>
<div class="size-1-8>C</div>
<div class="size-1-8>D</div>
</div>
The output accomplishes what I'm trying for but I'm wondering if it's the right way to go about it. I'm used to bootstrap which has convenient "offset" classes for grid columns.
Related, how do I get two columns in the mobile breakpoint instead everything in the grid dropping to one column?