Bootstrap Grid system Another perfect feature is that you can easily write columns in one order, and then display the columns in a different order.
You can easily change the order of the built-in grid columns with the . col-md-push-* and . col-md-pull-* classes, where the * range is from 1 to one.
In the following example, we have two columns of layout, the left column is very narrow, as the sidebar. We will use the . col-md-push-* and . col-md-pull-* classes to swap the order of the two columns.
<! DOCTYPE html>class= "Col-md-4"Style= "Background-color: #dedef8; Box-shadow:inset 1px-1px 1px #444, inset-1px 1px 1px #444;">I'm on the left .</div> <divclass= "Col-md-8"Style= "Background-color: #dedef8; Box-shadow:inset 1px-1px 1px #444, inset-1px 1px 1px #444;">I'm on the right .</div> </div><br> <div class= "Row" > <p> sort after </p> < ;d IVclass= "Col-md-4 col-md-push-8"style="Background-color: #dedef8; Box-shadow:inset 1px-1px 1px #444, inset-1px 1px 1px #444;">I'm on the left .</div> <divclass= "Col-md-8 col-md-pull-4"style="Background-color: #dedef8; Box-shadow:inset 1px-1px 1px #444, inset-1px 1px 1px #444;">I'm on the right .</div> </div> </div></body>
Bootstrap column sort