IE6でのHTMLの浮動クリア問題

Question

誰も私にこれらの3つのコードフラグメントがまったく同じように表示される理由を説明することができますIE6？

<div id="wrap"> 
    <div></div> 
    <!-- below is cleared --> 
    <div class="clear"></div> 
    <div></div> 
    <div></div> 
</div> 

2：

<div id="wrap"> 
    <div></div> 
    <div></div> 
    <!-- below is cleared --> 
    <div class="clear"></div> 
    <div></div> 
</div> 

3：

<div id="wrap"> 
    <div></div> 
    <div></div> 
    <div></div> 
    <!-- below is cleared --> 
    <div class="clear"></div> 
</div> 

1（第四子DIVは、2番目の '行' もう一つは、 'クリア' している間に開始されることを意味します）

CSS：

#wrap { 
    position:relative; 
    width:1000px; 
    height:400px; 
    padding:0px; 
    margin:0px; 
    border:solid 1px black; 
} 

#wrap div { 
    float:left; 
    width:150px; 
    height:100px; 
    background-color:blue; 
    padding:0px; 
    margin:0px; 
    border:solid 1px black; 
} 

.clear { 
    clear:left; 
} 

Answer 1

の1-使用とTIDY HTMLの乱用（オンラインバージョンが存在する）

私はあなたのdivに対して実行しました：

<style type="text/css"> 
/*<![CDATA[*/ 
    div.c3 {position:relative;width:1000px;height:400px;padding:0px;margin:0px;border:solid 1px black;} 
    div.c2 {clear:left;float:left;width:150px;height:100px;background-color:blue;padding:0px;margin:0px;border:solid 1px black;} 
    div.c1 {float:left;width:150px;height:100px;background-color:blue;padding:0px;margin:0px;border:solid 1px black;} 
    /*]]>*/ 
    </style> 

とコード...

<div class="c3"> 
    <div class="c1"></div><!-- below is cleared --> 

    <div class="c2"></div> 

    <div class="c1"></div> 

    <div class="c1"></div> 
    </div> 

多くのクリーナー。 このサイトはバギーIE6の実装上のご質問にお答えかもしれません：

http://css-class.com/articles/explorer/floats/floatandcleartest1.htm