仅在Safari上启动Bootstrap 4网格问题

Question

我使用Bootstrap 4创建了一个完整的网站。现在我注意到，如果一行中的列数等于12，则每列开始一个新行，而不是换行到前一行。当列数较小（如10）时，没有问题。这看起来像一个灵活的＃11，但是当我试图设置边框1px或设置flex-basis到列时，问题仍然存在。

当我将较低的弹性基础设置为49.9％而不是50％时，问题就消失了，但我认为这不是解决这个问题的正确方法，因为这不起作用在所有部分。

您有其他方法来修复此错误吗？你需要我的更多信息吗？谢谢你的帮助！

标题示例：

＆＃13;

＆＃13;

ul li {
  display: inline-block;
 }

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="row">
    <div class="col-3">
      <div class="ccfw-site-logo">
        <a href="/" class="custom-logo-link" rel="home">
          <img src="/wp-content/uploads/2017/09/logo.png" srcset="/wp-content/uploads/2017/10/logo@2x.png 2x" alt="etrose logo" />
        </a>
      </div>
    </div>
    <div class="col-9">
      <div class="ccfw-primary-nav clearfix">
        <ul>
        <li><a href="/"><span>Home</span></a></li>
          <li><a href="#onas"><span>About us</span></a></li>
          <li><a href="#wartosci"><span>Our vision</span></a></li>
          <li><a href="/uslugi"><span>Services</span></a></li>
          <li><a href="/praca"><span>Job offers</span></a></li>
          <li><a href="/kontakt"><span>Contact</span></a></li>
        </ul>
      </div>
    </div>
  </div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>

＆＃13;

＆＃13;

＆＃13;

Chrome和Safari的截图：

Answer 1

可能与此有关：Bootstrap 4 Safari on Mac Grid issue

问题似乎是野生动物园如何处理.row:after, .row:before{display:table;} 导致.col内部的.row换行。

Answer 2

将css旧代码替换为此代码

.ccfw-site-logo a {
line-height: normal !important;
}