导航栏css不能在firefox中正确显示,但可以使用IE
css代码
#topnav ul
{
display:table;
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
#topnav li
{
float:left;
}
#topvav a:link,
#topnav a:visited
{
display:block;
width:120px;
font-weight:bold;
font-family:calibri;
color:#FFFFFF;
background-color:#98bf21;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
#topnav a:hover,
#topnav a:active
{
background-color:#7A991A;
}
html代码
<ul id="topnav">
<li id="topnav"><a href="#home">Home</a></li>
<li id="topnav"><a href="#news">OPD</a></li>
<li id="topnav"><a href="#news">IPD</a></li>
<li id="topnav"><a href="#news">Infrastucture</a></li>
<li id="topnav"><a href="#news">Gallery</a></li>
<li id="topnav"><a href="#news">Media</a></li>
<li id="topnav"><a href="#contact">Site Map</a></li>
<li id="topnav"><a href="#about">About</a></li>
</ul>
</tr>
您未正确使用id
ID的必须是整个页面的唯一。此外,您不需要具有id的li
元素。您可以像这样通过CSS访问li
元素。
#topnav li
那么,您的选择器#topnav ul
无效。它应该是ul#topnav
(就我从你发布的HTML中看到的而言)
将#topnav
li
中的"float: left;
"更改为"display: inline;
"。