3

我有一个下拉菜单，可以在我的 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>
4

1 回答 1

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;
}
于 2012-10-24T15:07:52.007 回答