Еще один сломанный CSS CSS CSS

Question

Это динамический сайт 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> 

Answer 1

Попробуйте положить это в вашей голове тега

<meta http-equiv="X-UA-Compatible" content="IE=100" > 

также

Когда такого рода вещи происходит - перейдите в Инструменты -> Режим совместимости ; и убедитесь, что он выключен. У меня была аналогичная проблема и ее переключение заставляло мое меню работать правильно (там, где он вообще не работал).