Bootstrap 4 right Column on top on mobile view

问题

I have a Bootstrap 4 Page like this:

<div class="row">
    <div class="col-md-8">
        A
    </div>
    <div class="col-md-4">
       B
    </div>
</div>

Looks like:

-----
|A|B|
-----

So if I look at it on a mobile Device, the Column A is on top, but I want the B on top. Is this possible? I tried it with push an pull, but it didn't work Because I'm using Bootstrap 4.

回答1:

With Bootstrap 4 you can use the following classes.

order-first, order-last and order-0 - order-12

on your element.

Have a look here: Column ordering in Bootstrap 4

回答2:

have you tried like this

<div class="row">
    <div class="col-md-8 col-sm-8 col-xs-8">
        A
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4">
       B
    </div>
</div>

The Bootstrap grid system has four classes col-xs, col-sm, col-md, col-lg. That classes can be combined to create more dynamic and flexible layouts.

来源：https://stackoverflow.com/questions/46920385/bootstrap-4-right-column-on-top-on-mobile-view