2009-08-16 9 views
0

私はIE6に少し問題があるようですが、通常はIE6のサポートを中止しますが、私がそこで作業しているプロジェクトは、サイトを訪れる人がたくさんいるチャンスですIE6。 IE6をお持ちで、問題をチェックアウトしたい場合は、私のホームページを使用してください。IE6フロートドロップ

基本的にdiv#contentはdiv#left以下になります。 私はRobert Nymanメソッドを試しましたが、それはうまくいきませんでした。 体は他の方法を知っていますか?

<html> 
<style type="text/css"> 
#wrapper{ width:980px; margin:auto; background-color:#fff } 
#header{ width:980px; position:relative } 
#middle{ width: 980px; padding:20px; overflow:hidden; clear:both } 
#left{ float:left; width:200px } 
#main{ width:740px; margin: 0px 0px 0px 210px } 
#content { width: 480px; min-height: 400px; float:left } 
#right{ float:left; width:240px; margin: 0px 0px 0px 10px } 
#footer{ clear:both; width:980px; margin:auto; padding:20px 0 } 
</style> 

<body> 
<div id="wrapper"> 
    <div id="header"> 

    </div> 
    <div id="middle"> 
     <div id="left"> 

     </div> 
     <div id="main"> 
      <div id="content"> 

      </div> 
      <div id="right"> 

      </div> 
     </div> 
    </div> 
</div> 
<div id="footer"> 

</div> 

答えて

0

IコンテンツDIVにstyle="float: left; clear: none;"を添加し、そして中間DIV及び右のdivが同一平面上にあったが、両方が左DIVの絶頂を押し下げたようにそれはそれを修正。

コンテンツdivとright divをラッパーdivにラップしていますが、左divを残しているのはなぜですか?それはおそらく関連している。

0

まず、ページが標準準拠モードでレンダリングされるように、適切なdoctypeが必要です。 quirksモードでレンダリングされている場合、IEはあなたの要素の大部分のサイズを変更する別のボックスモデルを使用します。

mainまたはcontent divが低下していますか? main divの場合は、left divの左に浮動小数点を表示させることができます。

要素のサイズを調整する必要がある場合があります。 IE6では、別の要素の要素に合わせるために3つの余分なピクセルが必要になることがあります。

0

問題を修正しました。

私は条件文を使用して20から10にパディングを変更:

<!--[if lte IE 6]> 
<style type="text/css"> 
    #middle{ width: 980px; padding:10px; overflow:hidden; clear:both; } 
</style> 

1

それは、初見の可能な理由(私も問題に潜っていない)から参照するのは簡単です:

1)常にDOCTYPEを使用してください!それがなければ、クロスブラウザーの通常難易度コードを決して作れません。

2)フロートプロパティを頻繁に使用してください。

3)私は実際に幅:980pxのブロックを見るのに驚いています。パディング:20ピクセル。それはブロックで配置する必要があります:width:980px;幅に含まれる詰め物は過去です!

4)#rightはプロパティを持っています:float:left; margin-left:10px; - この場合、IE6はmargin-left = 20pxになります。これは非常に有名なバグです。このブロックにこのプロパティを追加します。display:inline;それは大丈夫になるでしょう(理由は、パディングにはありませんが、余白にはありません)

そしてstandartsと推奨事項を読むのを忘れないでください!