html - Web 固定页眉和页内锚点位置错误

Question

我在网页固定页眉和页内锚点方面遇到问题。首先我看到这篇文章： “HTML 位置：固定页眉和页内锚点” ，然后我输入以下代码：

HTML：

<a href="category.html#phone">PHONE</a>
<div class="subject2">PHONE</div>
<a name="phone" class="anchor"></a>

CSS：

.anchor{
    position:relative;
    top:-166px;
}

查看 jsfiddle

这适用于办公计算机上的 Chrome 和 Firefox，但是当我在自己的计算机上看到时发生了奇怪的事情：锚显示 top:0 而不是 top:-166，就像 IE 一样！

当它在同一个浏览器中显示不同时有什么问题？我错过了什么？

谢谢！:)