IE6とIE7フロートの問題は、多くの人々、私はIE7での浮動要素に問​​題が午前（および6を、私はそれを気にしない！）のような

Question

は

http://www.storybox.co.nz/wordpress/

は正常に見えます他のすべてのブラウザではなく、IE7でナビゲーションリンクは、お互いの下に座る：

HTML（インラインスタイルは、JSドロップダウンスクリプトからです）：

<div id="primary-menu"> 
    <div class="menu"> 
    <ul> 
     <li><a href="#" class="sf-with-ul">Work.</a> 
     <ul class="sub-menu" style="float: none; width: 1em; visibility: hidden; display: none;"> 
      <li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">Spatial /</a></li> 
      <li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">Web /</a></li> 
      <li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">Graphic</a></li> 
     </ul> 
     </li> 
     <li><a href="#">Lab.</a></li> 
     <li><a href="#">About.</a></li> 
    </ul> 
    </div> 
</div> 

012私はディスプレイを試してみました

#primary-menu { 
    margin:-30px auto 30px; 
} 
#primary-menu ul { 
    float:right; 
} 
#primary-menu li { 
     float: left; 
     list-style: none; 
     margin-left: 10px; 
      display:inline; 
} 
#primary-menu ul li a { 
     float: right; 
} 

：

CSS li項目についてだけでなく、a項目のインラインが、それは動作しません。

その他のヒントはありますか？ありがとう！

Answer 1

問題が多分幅：100％です。 ulが100pxの場合、それぞれのliも100px =と表示されます。それらの固定幅を設定しようとしますが、3x幅（+パディング、マージン）はulの幅より小さくする必要があります。また、33％を試すこともできます。 BT

float：right puts display：アイテムをブロックし、ディスプレイを追加することは意味がありません：floatと一緒にインライン：right。私の推測では、IEは表示を無視している：インライン。また、インライン要素の幅を置くことも意味がありません。あなたのCSSシンプルは分かりません:)

Answer 2

私はIE 7でテストしましたが、以下は更新されたCSSです。

#primary-menu { 
    /* margin:-30px auto 30px;*/ /*Avoid negative margins*/ 
} 
#primary-menu ul { 
    float:right; 
} 
#primary-menu li { 
    float: left; 
    list-style: none; 
    margin-left: 10px; 
     display:inline; 
} 
#primary-menu ul li a { 
    /* float: right;*/ /*This caused the issue*/ 
    } 

ホープこれは@mkk