21.1 #Row-grid.Columns-order Columns order

.sf-row__col.-order-{1, 2, 3,..., 12}

.sf-row__col.-order-2

I am first in the markup but ordered second on the screen

.sf-row__col.-order-3

I am second in the markup but ordered third on the screen

.sf-row__col.-order-1

I am third in the markup but ordered first on the screen

Html

    <div class="sf-row">
       <div class="sf-row__col -order-2">
           .sf-row__col.-order-2
           <p>I am <strong>first</strong>&nbsp;in the markup but ordered second on the screen</p>
       </div>
       <div class="sf-row__col -order-3">
           .sf-row__col.-order-3
           <p>I am <strong>second</strong>&nbsp;in the markup but ordered third on the screen</p>
       </div>
       <div class="sf-row__col -order-1">
           .sf-row__col.-order-1
           <p>I am <strong>third</strong>&nbsp;in the markup but ordered first on the screen</p>
       </div>
    </div>