フロートは、IE 7とIE 8に違って見える（HTMLが検証）

Question

こんにちは、私はクローム（ターゲット）とIE 7/8でこのページのレンダリングの違いを理解しようとしています：

http://phor.net/PRIV/md2/ (it validates) 

IEで7、上のナビゲーションバーはLIを浮かせませんし、IE 8では、上にひどいマージンがあります。

このページでは、ナビゲーションバーを修正する方法上の任意のアイデア

http://phor.net/PRIV/md2/style.css 

内のすべてのスタイルで、非常に簡単ですか？ご協力いただきありがとうございます。

Answer 1

IE7は、ナビゲーションバーで使用しているインラインブロックプロパティを完全にサポートしていません。

http://www.quirksmode.org/css/display.html

代わりにフロートを使用してみてください。

#navbar ul li { float: left; } 

その後、フロートをクリアしてください。

Answer 2

代わりdisplay:inline-table

変更の使用float:leftプロパティをこの

#navbar li { 
font: 14px Arial; 
margin: 0; 
margin-right: -2em; 
list-style-type: none; 
display: inline-table; 
} 

#navbar li { 
font: 14px Arial; 
margin: 0; 
list-style-type: none; 
float:left; 
Padding:0px 10px 0px 10px;} 

Answer 3

へ

#navbar li { display:block; float:left; width:160px;} 
#navbar ul { overflow:hidden;} 

を試してみて、すべての削除あなたは

Example

Answer 4

IE7はinline-tableをサポートしていないためdisplay:inline-table

は、私はあなたがfloat: left;またはdisplay: inline;使用することができ、例を作ります。

申し訳ありませんが、IE8では大きなマージンはありません。