By using the
order- prefix you can start with a stacked, mobile-first layout.. then at a larger screen size essentially push and pull the blocks of content using the order prefix.
Bootstrap 3 allowed you to use push and pull prefixes, those classes are gone in the latest version of bootstrap. Now, you’ll need to use the .order- prefix to alternate the layout of our page content.
Here’s an example of how it works.
<div class="container"> <section class="row"> <div class="col-xs-12 col-md-6 order-md-2"> <p>1st on small; right on larger screens</p> </div> <div class="col-xs-12 col-md-6 order-md-1"><p>bottom on small; left on large</p> </div> </section> </div>