Bootstrap reordering columns on small Devices -
i have simple layout 2 columns in twitter bootstrap.
on large devices large colum should on left side , small on right one. when view page on mobile device smaller screen , pages stacked have left colum on top of right one.
large devices: ----- colum 1 --- colum 2---- small devices: ----- colum 2 ----- ----- colum 1 -----
my code @ moment following:
<div class="row clearfix"> <div class="col-md-9 column"> <div class="col-md-3 column"> </div>
if understood correctly, need this:
<div class="container"> <div class="row"> <div class="col-xs-12"> <div class="col-md-3 pull-right">field2 - width 3</div> <div class="col-md-9 pull-right">field1 - width 9</div> </div> </div> </div>
the base approach mobile first. set smallest screen first , apply adjustments larger screen sizes.
"pull-right
" on every field reverse order.
Comments
Post a Comment