css - How to make element appear 2nd in two-column layout and 3rd when stacked with Bootstrap 3 -
i've got following layout using bootstrap:
[1][2] [3]
it stacks in 1 column on handheld devices this:
[1] [2] [3]
i need stack this:
[1] [3] [2]
how done?
there feature in bootstrap called column ordering.
here working example needs:
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> <div class="container"> <div class="row"> <div class="col-sm-5 "> content 1 </div> <div class="col-sm-5 col-sm-push-5"> content 3 </div> <div class="col-sm-2 col-sm-pull-5"> content 2 </div> </div> </div>
Comments
Post a Comment