Bootstrap下拉菜单仅适用于Firefox

Question

我正在尝试使用Bootstrap创建一个下拉菜单，它适用于Firefox，但下拉菜单中的链接在IE或Chrome中都不起作用......有什么想法吗？

<!--This is the navigation that comes up on every main pages -->
 <nav id="main_nav">
 <ul class="nav nav-pills">
 <li class="pads active"><a href="index.html">Home</a></li>  <!-- Make this element the different for active -->
 <li class="pads"><a href="about.html">Portfolio</a></li>

<!--the data-toggle="dropdown" is to let the anchor toggle instead of going to another site-->
<li class="pads"><a data-toggle="dropdown" class = "dropdown-toggle" href="projects.html">Projects<span class="caret"></span></a>
    <ul class="dropdown-menu" id="drop_nav">
        <li><a role="menuitem" href="191stband/191stband.html">Website</a></li>
        <li><a role="menuitem" href="agi/agi.html">AGI Calculator</a></li>
        <li><a role="menuitem" href="workout.html">Daily Workout App</a></li>
  </ul>
</li>
<li class="pads"><a href="contact.html">Contact</a></li>
</ul>
</nav>

Answer 1

我找到了自己问题的答案。我有CSS如下：

main_nav{ z-index:1; }

我只需删除z-index属性，下拉列表就可以在Chrome中使用。