2010-12-01 7 views
1

横に表示する必要がある3つのボタンのリストがあります。すべてがFFで良いですが、IEはそれらを直接重ねて積み重ねています。リスト項目の私のコードは以下の通りです。あなたの助けのための横に表示する必要があるときにInternet Explorerがリストを縦に表示する

おかげで

<style type="text/css"> 


      #navigation { 
     list-style: none; 
     margin: 0px 0px 0px 278px; 
     padding: 0; 
     text-align:left; 
     z-index:1;  

    } 

    #navigation li { 
     display: inline-block; 
    } 

    #navigation a { 
     display: block; 
     width: 140px; 
     height: 15px; 
     background: url("http://aracelid.110mb.com/boton_ROLLOUT_08.png") no-repeat; 
     padding: 10px 0.5em; 
     color: #FFFFFF; 
     text-decoration: none; 
     font-size:12px; 
     text-align: center; 
    } 

    #navigation a:hover { 
     background: url("http://aracelid.110mb.com/boton_ROLLOVER_08.png") no-repeat; 
    } 


      #one, #two,#three {background: url("http://aracelid.110mb.com/boton_ROLLOUT_08.png") no-repeat 0px 0px;} 

     #one_div{width:140px;height:36px;} 
#two_div{width:140px;height:36px;} 
#three_div{width:140px;height:36px;} 

<ul id="navigation"> 
    <li><a href="#" id="one" style="color:#FFFFFF;text-decoration:none;" ><div id="one_div">One</div></a></li> 
    <li><a href="#" id="two" style="color:#FFFFFF;text-decoration:none;"><div id="two_div" >Two</div></a></li> 
    <li><a href="#" id="three" style="color:#FFFFFF;text-decoration:none;"><div id="three_div" >Three</div></a></li> 
</ul> 

答えて

1

フロートを追加します。navgivation李クラスに残っ..

#navigation li { 
     display: inline-block; 
     float:left; 
    } 
+0

働いていました!どうもありがとう !! – dada

+0

あなたは大歓迎です:) –

+0

floatを使用すると表示値は無視されます。それがIE6でなければ、display:inlineを使ってダブルマージンバグを修正することができます。 – Mig

関連する問題