Bootstrap 行不会填充 Safari 上 space 的其余部分，如果它紧邻左浮动元素

Question

这是代码 https://jsbin.com/pabixobula/1/edit?html,output

  <div class="container">
      <div class="float-left" style="background:red">123123</div>
      <div class="row">
        <div class="order-1">23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123</div>
        <div class="order-2">23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123 23123 1231 23123 123123 123 123</div>
      </div>
  </div>

我需要使用 row 让 order-* class 处理订单。它在 Chrome 和 Firefox 上运行良好，但在 Mac.

上的 Safari 13 上运行不正常

第一个块是 float-left，但 row 在 Safari 上采用新行。我看到问题可能来自 display:flex，它在 Safari 上无法正常工作。

Answer 1

我发现解决方法是在 row 周围添加 m-0，这可能是 Safari 在行上添加额外边距的错误，这会创建新行。

<div class="row m-0"></div>

Bootstrap 行不会填充 Safari 上 space 的其余部分，如果它紧邻左浮动元素

Bootstrap row doesn't fill the rest of the space on Safari if it's next to float-left element

safari

row

flexbox

bootstrap-4