IE6サブメニューリストがドロップされない

Question

ie6には問題があります：ホバー可視性と子セレクタはありますが、私のサブメニューがドロップされない理由はわかりません。私はコードを含んでいて、誰かが私のエラーがどこにあるのか教えてくれたら大変感謝していますか？これは、以前の投稿で受信した返信の続きです。あなたはhtcファイルの動作を試したことに気づくでしょう。それは私にとってもうまくいきません。おかげ

<ul id="navigation" class="nav-main"> 
      <li><a href="http://www.somedomain.com/">Home</a></li> 
      <li class="list"><a href="#">Freebies</a> 
      <ul class="nav-sub"> 
      <li><a href="http://www.somedomain.com/category/backgrounds/">Backgrounds</a></li> 
      <li><a href="http://www.somedomain.com/category/buttons/">Buttons</a></li> 
      <li><a href="http://www.somedomain.com/category/graphics/">Graphics</a></li> 
      <li><a href="http://www.somedomain.com/category/html-css/">HTML &amp; CSS</a></li> 
      <li><a href="http://www.somedomain.com/category/icons/">Icons</a></li> 
      <li><a href="http://www.somedomain.com/category/psd/">PSD</a></li> 
      <li><a href="http://www.somedomain.com/category/templates/">Templates</a></li> 
      <li><a href="http://www.somedomain.com/category/tutorials/">Tutorials</a></li>  
      </ul> 
      </li> 

      <li class="list"><a href="#">About</a> 
      <ul class="nav-sub"> 
      <li><a href="http://www.somedomain.com/about/">AboutUs</a></li> 
      <li><a href="http://www.somedomain.com/commercial-use/">Commercial Use</a></li> 
      <li><a href="http://www.somedomain.com/about/terms-of-use/">Terms Of Use</a></li> 
      </ul> 
      </li> 

      <li><a href="http://www.somedomain.com/advertise/">Advertise</a></li> 
      <li><a href="http://www.somedomain.com/contact/">Contact</a></li> 


     </ul> 


body { 

    behavior: url(csshover3.htc); 
} 

#navigation { 
    margin:0; 
    padding: 0; 
    clear:both; 
    width:999px; 
    height:51px; 
    background: #d6eaf8 url(../images/dropdown-bg.gif) repeat-x left top; 
} 


ul.nav-main, 
ul.nav-main li { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
} 


ul.nav-main { 
    position: relative; 
    z-index: 597; 
} 

ul.nav-main li:hover > ul { 
    visibility: visible; 

} 


ul.nav-main li.hover, 
ul.nav-main li:hover { 
    position: relative; 
    z-index: 599; 
    cursor: pointer; 
    background: url(../images/dropdown-bg-hover.gif) repeat-x left top; 

} 



ul.nav-main li { 
    float:left; 
    display:inline-block ; 
    height: 100%; 
    color: #999; 
    font: 14px Tahoma, Verdana, Arial, Helvetica, sans-serif; 
    background: url(../images/separator.gif) no-repeat right center; 

} 

ul.nav-main li a { 
    display:inline-block; 
    padding: 16px 16px 0 16px; 
    height: 35px; 
    color: #fff; 
    font: 14px Tahoma, Verdana, Arial, Helvetica, sans-serif; 
    text-decoration:none; 
} 

ul.nav-main li a:hover { 
    color:#D6D6D6; 

} 



ul.nav-main *.list { 
    padding-right: 22px; 
    background: url(../images/navigation-arrow.gif) no-repeat right top; 
} 



ul.nav-sub { 
    display:block; 
    position: absolute; 
    padding:10px; 
    top: 48px; 
    left: 0; 
    z-index: 598; 
    background: #353535 url(../images/dropdown-list-bg.gif) repeat-x left top; 
    border-right: 1px solid #000; 
    border-bottom: 1px solid #000; 
    border-left: 1px solid #000; 

} 


ul.nav-sub li { 
    list-style:none; 
    display:block; 
    padding: 0; 
    height: 27px; 
    float: none; 
    width:145px; 
    border-bottom: 1px solid #5a5a5a; 
    background: none; 

} 

ul.nav-sub li a { 
    list-style:none; 
    display:none; 
    padding: 6px 5px 6px 5px; 
    height: 15px; 
    float: none; 
    width:145px; 
    background: none; 
    font: 12px Tahoma, Verdana, Arial, Helvetica, sans-serif; 

} 

ul.nav-main li:hover ul.nav-sub {  display:none; /* OR display:list-item */ } 

Answer 1

ベアリング..

not implemented in IE6ある>（direct child selector）を、使用しています

ul.nav-main li:hover > ul { 
    visibility: visible; 
} 

：IE6で、私が見ることができる1つの問題があります。

セレクタをul.nav-main li:hover ulまたはul.nav-main li:hover .nav-subに置き換えてみてください。

Answer 2

あなたのコンテンツは、アンカータグの周りにすでにある場合は、アンカーの代わりに、李さんにホバープロパティを添付し、あなたのCSSを変更してみてください。しかしそれはまだ問題になる可能性が高い。

これが動作しない場合、アンカータグにdisplay：inline-blockを追加してみてください。それ以外の場合は、javascriptでハックする必要があります。

<li><a>content</a></li> 

ul.nav-main li a:hover > ul { 
    visibility: visible; 

} 


ul.nav-main li a.hover, 
ul.nav-main li a:hover { 
    position: relative; 
    z-index: 599; 
    cursor: pointer; 
    background: url(../images/dropdown-bg-hover.gif) repeat-x left top; 

} 

何かがそうです。アンカータグ以外のもののホバープロパティは、IEの初期のバージョンでは問題があります。あなたはまた、代わりにこのような何かを試みることができる：

http://www.danvega.org/blog/index.cfm/2008/1/1/CSS-hover-selector

Answer 3

あなたはIE6のために、いくつかのJavascsriptを使用する必要があります。

li:hoverは問題です。 IE6はアンカータグのホバーサポートしています（私は今覚えていないこと、そしておそらくいくつかのフォーム要素を、しかし間違いない<li> s）は実際にテストすることなく、あなたがすでにWhatever:hoverを使用している心の中で