下拉菜單適用於Mac瀏覽器，但不適用於PC

Question

我有一個下拉菜單，可以在Mac，Opera，Safari，Firefox，Chrome中正常工作。

當我在PC上測試時，下拉菜單太長，'論壇'選項卡在底部被分流，並位於'主頁'選項卡下。這發生在Firefox，IE和Chrome上。這些是我迄今爲止測試過的唯一。

我對這個問題有點困惑。你有什麼建議嗎？

我談論的網站：http://www.makingsense.co.uk/index-new.html

代碼下拉菜單：

<div class="navigation-drop"> 

<div id="colortab" class="ddcolortabs"> 
<ul> 
<li><a href="index-new.html" title="Home"><span>Home</span></a></li> 
<li><a href="team.html" title="New"><span>Team</span></a></li> 
<li><a href="fv.html" title="CSS" rel="dropmenu1_a"><span>First Visit</span></a></li> 
<li><a href="pd.html" title="CSS" rel="dropmenu2_a"> 
    <span>Possible Diagnoses</span></a></li>  
<li><a href="ad.html" title="CSS" rel="dropmenu3_a"> 
    <span>After Diagnosis</span></a></li> 
<li><a href="treatment.html" title="CSS" rel="dropmenu4_a"> 
    <span>Treatment</span></a></li> 
<li><a href="follow.html" title="CSS" rel="dropmenu5_a"><span>Follow Up</span></a></li> 
<li><a href="support.html" title="CSS" rel="dropmenu6_a"><span>Support</span></a></li> 
<li><a href="contact-ooss.html" title="Useful Tools"><span>Contact Us</span></a></li> 
<li><a href="research.html" title="Useful Tools"><span>Research</span></a></li> 
<li><a href="forum.html" title="Useful Tools"><span>Forum</span></a></li> 
</ul> 
</div> 

<!--1st drop down menu -->             
<div id="dropmenu1_a" class="dropmenudiv_a"> 
    <a href="fv.html">Why have I been referred?</a> 
    <a href="fv-2.html">What happens on arrival?</a> 
    <a href="fv-3.html">What tests will I need?</a> 
</div> 

<script type="text/javascript"> 
//SYNTAX: tabdropdown.init("menu_id", [integer OR "auto"]) 
tabdropdown.init("colortab", 3) 
</script> 

Answer 1

嘗試更改字體大小爲11像素。

.ddcolortabs ul{ 
    font: normal 11px Arial, Verdana, sans-serif; 
    margin:0; 
    padding:0; 
    list-style:none; 
} 

然後，如果你寧願保持字體在12，減少對跨左/右填充：

.ddcolortabs a span { 
    background: none repeat scroll 0 0 #298D2F; 
    color: #ECEAE5; 
    display: block; 
    float: left; 
    padding: 7px 12px; 
}