IE6はa要素以外にはhover擬似クラスが対応しないということで、
Whatever:hoverの「csshover.htc」を使用し、他の要素にもhover疑似クラスを使用。
csshover.htcをDLしたら、WPの階層へアップし,
まずはスタイルシートに絶対パスで書いて。。
ul#menu-eng { /* IE6 対策 */
behavior: url(“http://asdfghj.com/csshover.htc”);
margin: 0px;
padding: 0px;
list-style: none;
}
ul#menu-eng a {
/* color: #FFFFFF;
text-decoration: none;*/
color: #aaa;
display: block;
line-height: 38px;
padding: 0 10px;
text-decoration: none;
background-color: #333;
text-align: center;
width: auto;
white-space: nowrap;
}
ul#menu-eng a:link,
ul#menu-eng a:visited {
background: #333;
}
ul#menu-eng a:hover,
ul#menu-eng a:active {
color: #FF0; background: #999;
}
ul#menu-eng li {
float: left;
position: relative;
margin: 0;
width: 9em;
height: 2em;
font-weight: bold;
line-height: 2em;
list-style: none;
}
ul#menu-eng li a {
display: block;
width: auto;
height: 38px;
text-align: center;
}
/* 下層のメニューを不可視に */
ul#menu-eng li ul {
display: none;
}
/* 疑似要素 :hover で下層のメニューを可視に */
ul#menu-eng li:hover ul {
display: block;
position: absolute;
z-index: 100;
}
ul#menu-eng li ul li {
float: none;
margin: 0;
height:38px;
font-weight: normal;width: 180px;
}
もとからのスタイルのMenuのところで、干渉する項目を微調整。
こんな感じで何とかなりました。
参考にさせていただきました
[使える CSS テクニック] CSSで実現するプルダウンメニュー | バシャログ。
[CSS]IE6でよく遭遇する6つのバグとその解決方法 | コリス
IEで全ての要素に:hover擬似クラスセレクタを適応させるスクリプト | retujyou.com どうにもならない劣情の種子を植え付けられたばかりに
Whatever:hover
GRAM | グラム » HTC ファイルの格納場所