• 2.5.0

Reversed Order 

<div class="grid grid--rev">
    <div class="grid__item sm-w-1/2">
        <div class="box box--default box--tiny text-center">First column</div>
    </div>
    <div class="grid__item sm-w-1/2 xs-mrgt">
        <div class="box box--default box--tiny text-center">Second column</div>
    </div>
</div>

Reverse the columns order when they aren’t stacked. Useful to display something at the top on small screens but on the right on large screens.

  • Handle: @grid-reversed-order
  • Preview:
  • Filesystem Path: components/03-components/grid-and-widths/06-reversed-order.html