Question

使用bootstrap v4.0.0a6

我有两列。在较小的显示器上，右列col-md-4包裹在较大的列下。

在较大的显示器上，我想要右边较小的列，但在较小的显示器上，我希望较小的列位于顶部，而不是当前的底部。

如何使用bootstrap的网格布局让较小的列在较小的屏幕尺寸上显示？

.col-md-8 {
  background: red;
}

.col-md-4 {
  background: green;
}

  <div class="container">
    <div class="row justify-content-md-center">
      <div class="col-md-8">
          YYYYYY
      </div>
      <div class="col-md-4">
      XXXXXXXX
      </div>
    </div>
  </div>

Answer 1

我在这里找到答案：https://v4-alpha.getbootstrap.com/layout/grid/

Bootstrap 3中的push/pull类已更改。他们现在只是push/pull而不是col-**-push，而这已经变为push-xx-#。

看我的小提琴：https://jsfiddle.net/sky2r5ca/4/

如何使用引导网格布局在较小的显示器上移动右列？

1 个答案: