Hello, where I made mistake? I want to do:
5 7
to
7
5
<div class="col-md-5 col-xs-12 col-xs-pull-12">5</div>
<div class="col-md-7 col-xs-12 col-xs-push-12">7</div>
Hello, where I made mistake? I want to do:
5 7
to
7
5
<div class="col-md-5 col-xs-12 col-xs-pull-12">5</div>
<div class="col-md-7 col-xs-12 col-xs-push-12">7</div>
AFAIK you can’t reorder stacked columns in BS3; that’s because it uses a float
-based grid. However you can do it the other way round (i.e. mobile first):
<div class="row">
<div class="col-xs-12 col-md-7 col-md-push-5">7</div>
<div class="col-xs-12 col-md-5 col-md-pull-7">5</div>
</div>
Now BS4 uses a flex
-based grid, where you can reorder even stacked columns:
<div class="row">
<div class="col-xs-12 col-md-5 order-md-first">5</div>
<div class="col-xs-12 col-md-7 order-first">7</div>
</div>
Even then I think it’s still more intuitive with a mobile-first approach though (also it saves you one class):
<div class="row">
<div class="col-xs-12 col-md-7">7</div>
<div class="col-xs-12 col-md-5 order-md-first">5</div>
</div>
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.