0

我有一个导航菜单，它使用列表项作为按钮，按钮底部有一个颜色条。在大多数浏览器中，颜色栏显示在按钮底部，按钮内部。但在 Mac Firefox 上，颜色栏显示在按钮底部，超出按钮。因此，仅在 Mac Firefox 上，我的按钮比应有的高得多。有关如何让这些按钮在 Firefox 中正确显示以匹配它们在其他浏览器上显示更短的任何建议？

http://jsfiddle.net/trevoray/CEXts/3/

 .nav > li {
padding: 0;
float: left;
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%, rgba(183,183,183,1) 50%, rgba(249,249,249,1) 100%);
border-right: 1px solid #5d5d5d;
border-left: 1px solid #929292;
width: 169px;
height: 45px;
border-top: 1px solid #797979;
border-bottom: 1px solid #575757;
font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
letter-spacing: -0.5px;
font-size: 14px;
text-shadow: 0 -1px 3px #CCCCCC;
 }
4

2 回答 2

0

老实说，我不知道为什么会这样，但如果你height: 45px从li样式中删除，一切看起来都很好。

于 2013-04-01T22:27:43.493 回答
0

只需将边距设置为 0

 .nav > li {
 margin: 0;
 }

在我看来很好...

于 2013-04-01T22:28:25.853 回答