[css-d] suckerfish and ie

[info 2m-design.net]

Hey
 
I would build a suckerfish menu but the IE6 means to call a strike. In IE6
the 2nd menu layer was hidden under the next follow menu item...
i’d tested to fix it with any combinations of  “z-index” but nothing
happens... 
 
i havn’t no more idea and hope one of you could help me...
 
here the html code:
 
 
<div id="menu">
<ul id="nav">
    <li><a href="./index.html" title="#">Startseite</a></li>
    <li><a href="./geschichte.html" title="#">Geschichte</a></li>
    <li><a href="./berghotel.html" title="#">Das Berghotel</a></li>
    <li><a href="./zimmer.html" title="#">Zimmer</a></li>
    <li><a href="./restaurant.html" title="#">Restaurants & Bars</a></li>
    <li><a href="./hochzeit.html" title="#">Hochzeit</a></li>
    <li><a href="./sport_spiel.html" title="#">Sport & Spiel</a></li>
    <li><a href="./tagung.html" title="#">Tagung</a></li>
    <li><a href="./fotogalerie.php" title="#">Fotogalerie</a></li>
    <li><a href="./sportliches_oberhof.html" title="#">Sportliches
Oberhof</a></li>
    <li><a href="./ausflugsziele.html" title="#">Ausflugsziele</a></li>
    <li><a href="./preise_pauschalen.html" title="#">Preise & Pauschalen</a>
      <ul>
        <li><a href="./preise.html" title="#">Preise</a></li>
        <li><a href="./pauschalen.html" title="#">Pauschalen</a></li>
      </ul>
     </li>
    <li><a href="./presse.html" title="#">Presse</a></li>
    <li><a href="./gewinnspiel.html" title="#">Gewinnspiel</a></li>
    <li><a href="./gbuch.php" title="#">G&auml;stebuch</a></li>
    <li><a href="./kontakt_anfahrt.php" title="#">Kontakt & Anfahrt</a></li>
    <li><a href="./impressum.html" title="#">Impressum</a></li>
</ul>
</div>
 
 
 
And thats the css:
 
 
/* Navigation */
 
#nav, #nav ul { /* all lists */
               padding: 0;
               margin: 0;
               list-style: none;
               float : left;
               width : 110px;
               background-color : transparent;
    }
        
#nav li { /* all list items */
               position : relative;
               float : left;
               line-height : 15.5px;
               margin-bottom : -1px;
                width: 125px;
               border: 1px solid #d78821;
               background-color : transparent;
    }
        
#nav li ul { /* second-level lists */
               position : absolute;
               left: -999px;
               margin-left : 50px;
                margin-top : -10px;
               z-index:9;
    }
          
#nav li ul ul { /* third-and-above-level lists */
               left: -999px;
    }
        
#nav li a {
               width: 119px;
               display : block;
               color : maroon;
               font-weight : bold;
               text-decoration : none;
               background-color : #d78821;
               border: 1px solid #d78821;
               border-bottom-color: #eed592;
               padding : 0 0 0 5px;
    }
* html #nav li a { width : 122px;}
  
#nav li a:hover {
               border-color: #fdefbe;
               background-color : #fdefbe;
    }
        
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav
li.sfhover ul ul ul {
               left: -999px;
    }
        
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav
li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists
nested under hovered list items */
               left: auto;
    }
 
#menu { 
      margin-top: 24px;
      margin-left : 17px;
      }  
 
/* Navigation ende */
 
The javascript for hover in ie:
 
 
 
 
 
<script type="text/javascript"><!--//--><![CDATA[//><!--
 
sfHover = function() {
      var sfEls = document.getElementById("nav").getElementsByTagName("li");
      for (var i=0; i<sfEls.length; i++) {
            sfEls[i].onmouseover=function() {
                  this.className+=" sfhover";
            }
            sfEls[i].onmouseout=function() {
                  this.className=this.className.replace(new RegExp("
sfhover\\b"), "");
            }
      }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
 
//--><!]]></script>
 
 
 
 
Thanks a lot and hope for understanding my icky English
 
Micha
 
 
 
 
 

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/