- ベストアンサー
liタグのナビボタンがFirefoxで二重に表示
- liタグのナビボタンがFirefoxで二重に表示されてしまう問題について
- IEでは正しく表示されるが、Firefoxでは2段めから2つずつ表示され5つのナビボタンになる
- どのように記述すれば良いか
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
CSSを見ただけでは何をしたいかわからないので、適当な画像でテストしましたがますますわからなくなった。(添付画像) CSS(カスケーディング スタイルシート)なので、カスケーディングを使わないと数行で済むスタイルシートが何十行にもなって、何をしたいかも解らなくなります。 <body> <div class="header"> <h1>見出し</h1> <div class="nav"> <ul> <li><a href="AA">aa</a></li> <li><a href="BB">bb</a></li> <li><a href="CC">cc</a></li> </ul> </div> </div> だとして、 div.header div.nav{float:left;width:245px;} div.header div.nav ul,div.header div.nav ul li{ display:block;list-style:none; margin:0;padding:0; } div.header div.nav li{ height:60px; border:solid #999999 1px; border-width: 0 1px 0 0; } div.header div.nav li a{ width:100%;height:100%; background:url(aa.jpg) no-repeat 10px 20px;} } div.header div.nav li a[href="BB"]{ background-imag:url(bb.jpg); } div.header div.nav li a[href="CC"]{ background-imag:url(cc.jpg); } div.header div.nav span{visibility:hidden;} 位でよいはず。見やすいため全角スペースで字下げしてあります。
お礼
質問の内容に不備があり、すみません。 border-bottom を #sidebar ul li でまとめたら出来ました! ありがとうございました。