Drop down menu works in Mac browsers but not on PC

Question

I have a drop down menu which works fine in Opera, Safari, Firefox, Chrome on my Mac.

When I test it on a PC, the drop down menu is too long and the 'Forum' tab gets shunted off the end and sits under the 'Home' tab. This happens on Firefox, IE and Chrome. Those are the only ones I've tested to date.

I'm a bit confused as to the problem. Do you have anything you could suggest please?

The site I'm talking about: http://www.makingsense.co.uk/index-new.html

Code of drop down menu:

<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

Try changing the font size to 11px.

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

Then if you'd rather keep the font at 12, decrease the left/right padding on the spans:

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