Html Firefox和Chrome/Safari之间的边距差异

我在Firefox和Safari/Chrome之间的行距上似乎有点小问题

第一幅图显示了左侧的链接和底部表格后的文本行的外观：

如您所见，链接与矩形“first genesis group”徽标对齐

如您所见，链接在左侧有点垂直拉伸，因此不知何故导致底线向下移动一点

我发现这是一个利润率最高的问题：1px；我给了一组链接中的每一个链接（主页、关于我们、产品、联系人），而firefox似乎使1px的利润比Safari或Chrome大得多，并且扭曲了它

我试着放上通用标签

• {边距：0；填充：0；边框：0；}

但这似乎没有什么帮助。有没有办法在firefox中解决这个问题？

---

以下是实际链接：www.snowwhitepowers.com/genesis

我会将您的css编辑为以下内容：

ul.link{
    list-style:none;
    /*rest of your rules*/
}

ul.links li{
    display:block;
    width:145px; /* or however wide the ul is*/
    height:20px; /* or however tall they need to be*/
    line-height:20px; /* setting the line-height equal to the height centers text vertically*/
    border-top:1px dashed #5c6b40;
}

ul.links a{
    /* styles for links */
}

---

您还需要更加语义化地格式化html。

是关于不同的浏览器如何呈现不同的字体。（你会注意到，例如Verdana，他们两人都表现得很好）
我不同意第二点，但更多是出于好奇。如果你有一条虚线的多种用途，那么使用班级虚线来设计你的li是没有意义的？此外，如果您以后想要一个没有虚线的li呢？或者你是在建议内联css？这难道不被认为是一种失礼吗？@matchw是的，如果您希望在某些
之间使用虚线，而不是全部之间使用虚线，那么使用类是有意义的。但是，该规则仅适用于带有类链接的
中的
。因此，只有当您希望
中的一些
没有边界时，这才是一个问题。重点是，在行中使用css在语义上更为正确，因为一个充满破折号的
。哦，我没有意识到他有一个
----
，这比内联css更容易出错。抢手货
<ul class="links">
    <li><a href="home.html" target="iframe">Home</a></li>
    <li><a href="about.html" target="iframe">About Us</a></li>
    <li><a href="eggroll.html" target="iframe">Products</a></li>
    <li style="border-bottom:1px dashed #5c6b40;"><a href="contact.html" target="iframe">Contact Us</a></li>
</ul>