IEでリストが横に並ばない

質問

http://www.1uphp.com/con2/over/over2.html
のサイトを参考にリストを横に並べようとしてます。
Firefoxではちゃんと表示されるのですがIEでは縦になってしまいます。Float:left;をdisplay:inline;に変えてみても結果は同じでした。
また何故かマウスのロールオーバーした時にリンクを「白」に設定してあるのですがこれも1部分以外反映されません。
どなかた解決策が分かる方いましたらお手数ですがよろしくお願い致します。

ul{
width:540px;
height:35px;
list-style:none;
text-align:center;
font-size:145%;
font-weight:bold;
line-height:100%;
}

li{
font-size: 0.8em;
color: #333333;
float:left; }

a{display:block;
width:100%;
height:100%;
background-image:url();
background-position:0px 0px;
background-repeat:no-repeat;
color:#ffffff;
text-decoration:none;
}

a:link{ color: #3333ff; }
a:hover{
background-image:url();
background-position:0px -35px;
color:#ffffff; }
a:visited{ color: #333333; }

回答No.1

torayoshi · ベストアンサー

「floatを使ったボックスにはwidthを指定しなければいけない」
という決め事があるので、liのプロパティでwidthを指定してください。
それからCSSでは後から設定した値が優先されます。
擬似クラスにも宣言順位があるので、a:hoverはa:visitedの後に記述したほうが良いです。

以上でIE 7にてリスト横並び、ロールオーバーした時にリンクを「白」を確認出来ました。

お礼

有難う御座いました＾＾
早速出来ました！
が、リンクの色だけはいまだに変わりません。
何ででしょう…。リストを3つ並べていてFirefoxでは
3つ目だけちゃんと色が変わるのですがIEでは全て変化なしです＞＜

回答No.3

ICHI-yan

訪問しちゃった方が後ろに記載されているためです。
マウスが乗っているのをその後ろに移動させてください。
擬似プロパティは記述する順番を守らなければなりません。

お礼

出来ました！
タダ単に記述ミスでした。
お二方どうも有難う御座いましたm(__)m

回答No.2

torayoshi

#1です。
なんででしょうね ^^;
↓これ、どんなふうに見えますか？
http://www16.plala.or.jp/zaq_501/test/test.html