html - safari 中的边距顶部与 chrome 不同

Question

一个错误悄悄进入，我无法弄清楚它来自哪里。任何帮助将不胜感激。

如果您查看 Chrome 中的 [removed]，您会发现导航菜单左侧的 Logo 恰好位于菜单的垂直中心。但是，如果您在 Safari 中打开它，它的显示方式会有所不同。它与菜单的顶部对齐。

在 Safari 中添加负边距顶部以补偿它在 Chrome 中的困惑。

有什么办法解决这个问题吗？

Answer 1

为了让您了解如何快速清理它，您可以做这样的事情并以此为基础:

<header>
  <div class="container">
    <div class="three columns">
      <a href="http://www.1000islandsplayhouse.com/" alt="Thousand Islands Playhouse"><img id="header-logo" src="/assets/logo-300px.png" style="width:114px;height:100px;"></a>
    </div>
    <div class="nine columns">
      Navigation
    </div>
  </div>
</header>

一些 CSS 来做顶部的边距:

 header {
   margin-top: 30px;
 }