Question

css火狐兼容性问题

这是导航的样式
.top_nav{ position:relative;width:100%; height:48px; background:#2aa3ce; overflow:hidden;}
.top_nav ul{ position:relative;width:965px; height:48px; margin:auto; overflow:hidden;}
.top_nav ul li{ position:relative;width:107px; line-height:48px; text-align:center; float:left;font-family:"Microsoft YaHei"; font-size:16px;}
.top_nav ul li a:link,.top_nav ul li a:visited,.top_nav ul li a:active{ position:absolute; width:107px; height:48px; left:0px; top:0px;color:#fff;text-decoration: none; background:#06F;}
.top_nav ul li a:hover { position:absolute; width:107px; height:48px; left:0px; top:0px;text-decoration: none;color:#333;background:#333;}
在火狐显示的时候所有的链接都重叠在一起了，我设置li的啊链接样式是希望鼠标移动到上边整个区块变色，声的使用js麻烦

Answer 1

　　您好，感谢您对火狐的支持

　　a加上position:absolute之后，a标签就重叠了，所以会显示在一起。
　　您可以在火狐官方网站下载火狐浏览器，在火狐社区了解更多内容。希望我的回答对您有所帮助，如有疑问，欢迎继续在本平台咨询。

Answer 2

position:不要乱用。除了top_nav，其他的position:relative;position:absolute;都去掉。

.top_nav{position:relative;width:100%; height:48px; background:#2aa3ce; overflow:hidden;}
.top_nav ul{width:965px; height:48px; margin:auto; overflow:hidden;}
.top_nav ul li{width:107px; line-height:48px; text-align:center; float:left;font-family:"Microsoft YaHei"; font-size:16px;}
.top_nav ul li a:link,.top_nav ul li a:visited,.top_nav ul li a:active{color:#fff;text-decoration: none; background:#06F;}
.top_nav ul li a:hover {text-decoration: none;color:#333;background:#333;}

追问

我主要是想鼠标移动到连接上是这种显示效果的，不想用js，所以想到给a链接加宽高和position:absolute的，360 ie可以但是火狐什么的就不行了！

Answer 3

为什么你要给a加上position:absolute呢。加了这个，a标签都定位在一起了，肯定会重叠