twitter bootstrap 3 - Disabling responsiveness and Column ordering -
i have problems column ordering after disabling responsiveness in bootstrap 3.
<div class="row"> <div class="col-xs-9 col-md-push-3">...</div> <div class="col-xs-3 col-md-pull-9">...</div> </div>
if so, affect layout on resolution below 1024 - blocks change places. i've tried solutions, one...
<div class="row"> <div class="col-xs-9 col-xs-push-3">...</div> <div class="col-xs-3 col-xs-pull-9">...</div> </div>
... , one...
<div class="row"> <div class="col-md-9 col-md-push-3">...</div> <div class="col-md-3 col-md-pull-9">...</div> </div>
... , none of them work properly.
i want disable responsiveness , force col-9 block go first in html document , col-3 go after @ resolution, col-3 block (sidebar) must aligned left , col-9 block (main content) must aligned right. suggestions?
also read http://getbootstrap.com/getting-started/#disable-responsive , /or try maybe. https://github.com/bassjobsen/non-responsive-tb3. using col-xs-* classes seems right (cause never stack). xs grid don't have pull, push , offset classes.
add float right seems solution in case:
<div class="container" style="background-color:white;"> <div class="row"> <div class="col-xs-9" style="background-color:red;float:right;">right</div> <div class="col-xs-3" style="background-color:yellow;">left</div> </div> <div class="row"> <div class="col-xs-9" style="background-color:green;">right</div> <div class="col-xs-3" style="background-color:blue;">left</div> </div> </div>
Comments
Post a Comment