[問題] CSS二階選單在Firefox可以，在IE6看不行...

[creya (看見歐若拉)]

不好意思，因為第一次用到CSS做選單

沒想到FF和IE看CSS也這麼的不合

這二階選單我在FireFox看沒問題，第二階選單都可以跳出來

但在IE6都跳不出來，所以麻煩各位先輩幫我看看要怎麼修改，謝謝!!


-----------以下是CSS的部分-------

/* ———————- 二階選單 ———————- */
#outside{
        margin-left:auto;
        margin-right:auto;
        width:805px;
        }
#navigation-1 {
        padding:7px 0;
        margin:0px;
        list-style:none;
        width:804PX;
        height:39px;
        font-size:15px;
        font-weight:bold;
        background:transparent url(pic/bgOFF.gif) repeat-x top left;
        font-family:Arial,Verdana,Helvitica,sans-serif;
        border-top:1px solid #EEEEEE;
}
#navigation-1 li {
        margin:0;
        padding:0;
        display:block;
        float:left;
        position:relative;

}
#navigation-1 li a:link, #navigation-1 li a:visited {
        padding:4px 0;
        display:block;
        text-align:center;
        text-decoration:none;
        background:#b9121b;
        color:#333333;
        width:160px;
        height:19px;
        background:transparent url(pic/bgDIVIDER.gif) no-repeat top right;
}
#navigation-1 li:hover a, #navigation-1 li a:hover, #navigation-1 li a:active {
        padding:4px 0;
        display:block;
        text-align:center;
        text-decoration:none;
        color:#666666;
        width:158px;
        height:19px;
        border-left:1px solid #ffffff;
        border-right:1px solid #ffffff;
        background:#fff url(pic/bgON.gif) no-repeat top right;
}
#navigation-1 li ul.navigation-2 {
        margin:0;
        padding:1px 1px 0;
        list-style:none;
        display:none;
        background-color: #EBEBEB;
        color: #333333;
        width:158px;
        position:absolute;
        top:27px;
        border-top:none;
}
#navigation-1 li:hover ul.navigation-2 {
        display:block;
}
#navigation-1 li ul.navigation-2 li {
        width:157px;
        clear:left;
        width:157px;
}
#navigation-1 li ul.navigation-2 li a:link, #navigation-1 li ul.navigation-2 li a:visited {
        clear:left;
        background:#FFFFFF;
        padding:4px 0;
        width:158px;
        border:none;
        position:relative;
        z-index:1000;
}
#navigation-1 li ul.navigation-2 li:hover a, #navigation-1 li ul.navigation-2 li a:active, #navigation-1 li ul.navigation-2 li a:hover {
        clear:left;
        background:#EBEBEB;
        padding:4px 0;
        width:158px;
        position:relative;
        z-index:1000;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 {
        display:none;
        margin:0;
        padding:0;
        list-style:none;
        position:absolute;
        left:158px;
        top:-2px;
        padding:1px 1px 0 1px;
        background:#ffffff;
        z-index:900;
}
#navigation-1 li ul.navigation-2 li:hover ul.navigation-3 {
        display:block;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:link, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:visited {
        background:#b9121b;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 li:hover a, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:hover, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:active {
        background:#ec454e;
}
#navigation-1 li ul.navigation-2 li a span {
        position:absolute;
        top:0;
        left:155px;
        font-size:12pt;
        color:#fe676f;
}
#navigation-1 li ul.navigation-2 li:hover a span, #navigation-1 li ul.navigation-2 li a:hover span {
        position:absolute;
        top:0;
        left:129px;
        font-size:12pt;
        color:#ffffff;
}





------------------這是叫出選單的部分(雖然應該跟這沒關係)----------

  <div id="div"> <br />
      <div id="outside">
        <ul id="navigation-1">
          <li><a href="#" title="sample" target="_self" >ddd</a>
              <ul class="navigation-2">
                <li><a href="aaa.html" title="sample" target="_self" >aaa</a></li>
                <li><a href="bbb.html" title="sample" target="_self" >bbb</a></li>
                <li><a href="ccc.html" title="sample" target="_self" >ccc</a></li>
              </ul>
          </li>

      </div>
  </div>


-------------------------------------

謝謝大家




--
※ 發信站: 批踢踢實業坊(ptt.cc) 
◆ From: 220.134.181.166
推 lgzenith:IE6印象中CSS不支援兩層以上...IE7我是沒試過
→ lgzenith:還是用js做比較好吧
推 chph:IE 的 :hover 只能支援 a, 其他元素不支援
→ chph:↑ 6版
→ ileadu:印象中 ie6 只能靠javascript+css 做出你說的選單 純css no
推 fotofolio:加一個htc修正即可
→ fotofolio:http://www.xs4all.nl/~peterned/csshover.html
→ fotofolio:如果看不懂跟我說我很樂意回文ww
→ creya:謝謝fotofolio!!不過我加了behavior:url("csshover.htc");
→ creya:到我的CSS檔裡，也放了.htc檔，用IE還是跑不出下層耶！
→ creya:請問其它地方也需要跟著修改嗎？謝謝！
推 fotofolio:應該沒錯喔 是不是因為url()裡面不用""?
→ creya:我也覺得應該沒錯，但我還把它網站上的範例抓下來測試，
→ creya:沒想到我用IE看他線上的範例可以，抓下來在我電腦就不行= =
→ creya:我剛剛換一台電腦的IE6就可以勒!!而且版本還是一樣的!!
→ creya:真是太奇妙了!不過真的跑得出來，太感謝了~~~:)
推 ateclean:IE6可解 不過HTML會長得很醜 CSSPLAY有範例