‘'order’(bootsrap 4网格)在Safari IOS中不能正常工作

Question

这段代码在windows的桌面上运行得很好。但是当我在safari ios中测试它的时候，第三列总是崩溃并跳到一个新的行。

代码如下：

 <div class="container">
  <div class="row">
    <div class="col-4">
      First, but unordered
    </div>
    <div class="col-4 order-sm-4">
      Second in sm+, last in mobile
    </div>
    <div class="col-4 order-3">
      Last in sm+, Second in mobile
    </div>
  </div>
</div>

其他人也经历过吗？这是个bug吗？谢谢

Answer 1

我想你写错了order类。Bootstrap首先是移动端的，例如col-sm是sm，up (to lg)。

这可能就是你想要的：

<div class="container">
  <div class="row">
    <div class="col-4">
      First, but unordered
    </div>
    <div class="col-4 order-3 order-sm-1">
      Second in sm+, last in mobile
    </div>
    <div class="col-4 order-2">
      Last in sm+, Second in mobile
    </div>
  </div>
</div>

告诉我这段代码有没有什么问题！