Shifting columns in full width with foundation 5

Question

Goodmorning, this is my layout:

<div class="row">
  <div class="medium-8 small-12 columns">
     ...
  </div>
  <div class="medium-4 small-12 columns">
     ...
  </div>
</div>

My question is: is there a way to show on mobile layout first the last div and then the first? Because, if I use push and pull, I can shift them in medium layout ("medium-8 medium-push-4" and "medium-4 medium-pull-8") but not in the mobile one. And before using visibility class, I'd like to know if there was a smarter way.

Thank you for your help,

Marco

Answer 1

Have the layout according to your mobile screen. then use source rendering to align for small-up screens (have second div first).

<div class="row">
  <div class=" small-12 medium-4 medium-push-8 columns">
     your last div have it as first div and use source rendering for small-up screens
  </div>
  <div class="small-12 medium-8 medium-pull-4 columns">
     ...
  </div>
</div>