How do I change Bootstrap 3 div column order

Question

doing my 1st responsive design and is something like this possible in bootstrap 3. Change this on lg:

[a] [     ]
[b] [  c  ]
    [     ]

to th

Answer 1

You can use pull-right on column C... A-C-B on mobile.

<div class="row">
     <div class="a col-lg-6">
        A
     </div>
     <div class="c col-lg-6 pull-right">
        B
     </div>
     <div class="b col-lg-6">
        C
     </div>
</div>

Demo: http://bootply.com/9UNb9Q37G0

Answer 2

In your HTML markup, place the [c] between [a] and [b]. Add class 'pull-left' to a and b. Add class 'pull- right' to c. Finally, contain them in a div that defines breakpoints e.g class='col-sm-12 col-md-12'.

Answer 3

You can use two div. One is for first type of arrangements and other is for second type of arrangements. The first is only shown in lg and and last one is only in sm.

<div class="hidden-sm">

</div>

<div class="hidden-lg">

</div>