0

我一直在尝试在 css 中格式化 RSS 按钮的外观,并且由于某种原因,浏览器之间存在很大差异。Chrome 将它完美呈现,就好像我根本不需要弄乱它一样。但在 Firefox 和 IE9 上,它与菜单的其余部分不平衡。所以我添加了填充以使其均匀,并将悬停颜色拉长到菜单栏的底部。这解决了 Firefox 上的问题,但它使菜单在 Chrome 上以相反的方式不均匀。突然,该栏对于其他菜单项来说太长了。

.menunav a {
padding-right: 6px;
    padding-top: 3px;
    padding-bottom: 3px;
padding-left: 6px;
font-size: 100%;

}   
.menunav-rss:hover {
    background: #ff6600;
    font-size: 100%;
    padding-top: 3px;
    padding-bottom:3px;
}

这来自一个 wordpress 网站。我对 css 或编码很陌生,所以我不完全确定如何修改它。修复一个似乎会使另一个变得更糟,我不确定为什么只有 rss 按钮不均匀。

作为参考,这是 Firefox 和 Chrome 上没有任何填充的菜单栏。

任何帮助,将不胜感激。如果您需要更多信息,我可以轻松提供。

4

2 回答 2

0

这是由于浏览器具有不同的“预设”值。把它想象成每个浏览器都有自己的样式表,在你之前应用。

唯一的解决方法是使用 CSS 重置。Eric Mayers被认为是“goto”,几乎涵盖了您想要的所有内容。

只需在您自己的样式之前加载重置,然后您应该能够调整所有内容以在所有浏览器中看起来或多或少相同。

必须这样做有点痛苦,但您不应该真正依赖浏览器内置的默认样式。

于 2013-01-04T09:26:53.173 回答
0

我多次遇到同样的问题。我发现该设置vertical-align: top使它在 FF 和 chrome 中看起来相同(可能也是 IE9,尽管我还没有测试过),之后您可以添加padding-top以将文本定位在您想要的位置。

于 2013-01-27T06:15:02.400 回答