html - IE <a> 元素 float left 由于某种原因首先移动

Question

我有一些 <a>向左浮动的元素。由于某种原因，第一个元素在 IE10 中向上移动。 需要 float 它们，因为一些元素没有显示，否则 View 会变得很糟糕。

HTML

   <div id="Header-Links">
      <a id="Links-Start" href="#Start">Start</a>
      <a id="Links-Orders" href="#Orders" class="DisplayNone"></a>
      <a id="Links-References" href="#References"></a>
      <a id="Links-Account" href="#Account" class="DisplayNone"></a>
      <a id="Links-Customer" href="#Customer"></a>
      <a id="Links-Support" href="#Support"></a>
      <a id="Links-Impress" href="#Impress"></a>
   </div>

CSS

#Header-Links {
  top: 13px;
  left: 30px;
}

#Header-Links > a {
  text-decoration: none;
  float: left;
}

#Header-Links a + a:before {
  content: "|";
  margin-left: 7px;
  margin-right: 6px;
  font-weight: 900;
  text-decoration: none;
}

.DisplayNone {
   display: none;
}

谷歌浏览器


浏览器

Answer 1

某处元素的行高与第一个不同。