導航欄CSS無法正確顯示在Firefox，但它的確定與IE

Question

導航欄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; 
} 

OK

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> 

Answer 1

您使用id不是正確。 ID的必須爲唯一爲整個頁面。 你也不需要帶有ID的li元素。你可以像這樣通過CSS訪問li元素。

#topnav li 

然後，您的選擇器#topnav ul無效。它應該是ul#topnav（至於什麼我可以從你的HTML發佈看）

Answer 2

更改「float: left;」在#topnavli爲「display: inline;」。