这是一个动态的 pyrcocms 网站，因此使用 jsfiddle 发布的效果不太好。该菜单在所有当前主要浏览器和版本中都能正常工作。ie7当然不起作用，但我不支持它。IE8 不显示任何菜单，只显示列表和子列表。我有什么问题？
CSS：
nav ul#head-nav
{
width: 700px;
height: 35px;
float:right;
position:relative;
margin:10px 0 0 0;
padding-top:10px;
bottom:90px;
}
nav ul#head-nav ul
{
position: absolute;
left:-30px;
top:26px;
visibility: hidden;
z-index: 1000;
}
nav ul#head-nav li
{
font-family:Lato;
font-weight:700;
font-variant:small-caps;
background: url('../img/body-bg.jpg') top left repeat;
border-top-left-radius:5px;
border-top-right-radius:5px;
moz-border-top-left-radius:5px;
moz-border-top-right-radius:5px;
position: relative;
height:30px;
list-style: none;
padding-top:10px;
margin-left:1.5px;
margin-right:1.5px;
float: left;
text-align:center;
min-width:115px;
}
nav ul#head-nav .first
{
min-width:90px;
}
nav ul#head-nav li:hover
{
background:#5a81a0;
}
nav ul#head-nav li a, ul#head-nav li a:visited
{
font-size: 16px;
color: white;
text-decoration:none;
}
nav ul#head-nav li a:hover, ul#head-nav a:visited:hover
{
color: #ff6900;
text-decoration: none;
}
/* Header Menu second level */
nav ul#head-nav li:hover ul
{
visibility: visible;
}
nav ul#head-nav ul li
{
min-height:20px;
height:auto;
width:200px;
display: table-cell;
vertical-align: middle;
border-radius:0px;
border: 1px solid #e9e9e9;
padding: 3px;
background: #d8d8d8;
}
nav ul#head-nav ul li:hover
{
background:#5a81a0;
visibility: visible;
}
/* Header Menu third level */
nav ul#head-nav ul ul li
{
visibility: hidden;
}
nav ul#head-nav ul li:hover ul li
{
visibility: visible;
}
nav ul#head-nav ul ul
{
left:177px;
top:-15px;
padding-top: 0;
}
和 HTML：
<nav>
<ul id="head-nav">
<li class="first current"><a href="http://127.0.0.1/home">Home</a></li>
<li class="has_children"><a href="http://127.0.0.1/about-us">About Us</a>
<ul class="dropdown">
<li class="first"><a href="http://127.0.0.1/about-us/who-is-who">Who is Who</a></li>
<li><a href="http://127.0.0.1/about-us/bylaws">Bylaws</a></li>
<li><a href="http://127.0.0.1/blog">Blog</a></li>
<li><a href="http://127.0.0.1/about-us/meetings">Meetings</a></li>
<li><a href="http://127.0.0.1/about-us/trustees">Trustees</a></li>
<li><a href="http://127.0.0.1/about-us/history">History</a></li>
<li><a href="http://127.0.0.1/about-us/intergovernmental-agreement">Intergovernmental Agreement</a></li>
<li><a href="http://127.0.0.1/about-us/staff">Staff</a></li>
<li class="last"><a href="http://127.0.0.1/about-us/contact-us">Contact Us</a></li>
</ul>
</li>
<li class="has_children"><a href="http://127.0.0.1/benefits">Benefits</a>
<ul class="dropdown">
<li class="first"><a href="http://127.0.0.1/benefits/faqs">FAQs</a></li>
<li><a href="http://127.0.0.1/benefits/benefit-eligibility">Benefit Eligibility</a></li>
<li><a href="http://127.0.0.1/benefits/how-to-file-an-appeal">How to File An Appeal</a></li>
<li><a href="http://127.0.0.1/benefits/benefit-disqualifiers">Benefit Disqualifiers</a></li>
<li><a href="http://127.0.0.1/benefits/employee-development">Employee Development</a></li>
<li><a href="http://127.0.0.1/benefits/premium-calculation">Premium Calculation</a></li>
<li><a href="http://127.0.0.1/benefits/premiums">Premiums</a></li>
<li class="last"><a href="http://127.0.0.1/benefits/unemployment-information">Unemployment Information</a></li>
</ul>
</li>
<li class="has_children"><a href="http://127.0.0.1/eap">EAP</a>
<ul class="dropdown">
<li class="first has_children"><a href="http://127.0.0.1/eap/appreciation-packet-guides">Appreciation Packet Guides</a>
<ul class="dropdown">
<li class="first"><a href="http://127.0.0.1/eap/appreciation-packets/custodians">Custodians</a></li>
<li><a href="http://127.0.0.1/eap/appreciation-packets/food-service-personnel">Food Service Personnel</a></li>
<li><a href="http://127.0.0.1/eap/appreciation-packets/principals">Principals</a></li>
<li><a href="http://127.0.0.1/eap/appreciation-packets/teachers">Teachers</a></li>
<li><a href="http://127.0.0.1/eap/appreciation-packets/bus-drivers">Bus Drivers</a></li>
<li><a href="http://127.0.0.1/eap/appreciation-packets/superintendents">Superintendents</a></li>
<li class="last"><a href="http://127.0.0.1/eap/appreciation-packets/support-staff">Support Staff</a></li>
</ul>
</li>
<li><a href="http://127.0.0.1/eap/difference-makers">Difference Makers</a></li>
<li><a href="http://127.0.0.1/eap/writing-competition">Writing Competition</a></li>
<li><a href="http://127.0.0.1/eap/awards-programs">Awards Programs</a></li>
<li class="last"><a href="http://127.0.0.1/eap/appreciation-packets">Appreciation Packets</a></li>
</ul>
</li>
<li class="has_children"><a href="http://127.0.0.1/library">Library</a>
<ul class="dropdown">
<li class="first"><a href="http://127.0.0.1/library/videos">Videos</a></li>
<li><a href="http://127.0.0.1/library/stories">Stories</a></li>
<li class="last"><a href="http://127.0.0.1/library/links">Links</a></li>
</ul>
</li>
<li class="last has_children"><a href="http://127.0.0.1/news">News</a>
<ul class="dropdown">
<li class="first"><a href="http://127.0.0.1/news/news-u-trust">News U Trust</a></li>
<li><a href="http://127.0.0.1/news/connections-newsletter">Connections Newsletter</a></li>
<li><a href="http://127.0.0.1/news/news-releases">News Releases</a></li>
<li class="last"><a href="http://127.0.0.1/news/trustee-notes">Trustee Notes</a></li>
</ul>
</li>
</ul>
</nav>