floatでレイアウト。

CSS IE

IETesterをインストールして表示チェックをしている。
テーブルレイアウト嫌いで、主にfloatでレイアウトするのだけれどIE8betaの表示がおかしい。

//HTML　xml宣言略　XHTML1.0　Transitional

<div class="container">
　　<div class="leftBox">
　　　　<p>テキスト沢山。テキスト沢山。テキスト沢山。</p>
　　</div>

　　<div class="rightBox">
　　　　<p>テキスト沢山。テキスト沢山。テキスト沢山。</p>
　　</div>
</div>

<div class="container">
　　<div class="leftBox">
　　　　<p>テキスト沢山。テキスト沢山。テキスト沢山。</p>
　　</div>

　　<div class="rightBox">
　　　　<p>テキスト沢山。テキスト沢山。テキスト沢山。</p>
　　</div>
</div>

//CSS

.container {
　margin: 0px auto;
　padding: 0px;
　width: 800px;
　clear: both;
}

.leftBox {
　float: left;
　width: 375px;
　padding-bottom: 2em;
　min-height: 5em;
}

.rightBox {
　float: right;
　width: 375px;
　padding-bottom: 2em;
　min-height: 5em;
}

.containerにぐるっと囲うborderをつけると意図通りの配置になるのだけれど、なしだと内容量によっては最初のleftに回り込んでしまう。
.leftboxにclear:leftを追加することによって回避できた。
今までclear:bothしか使ったことがなかったし、使う必要も無かった。（必要の無いような作りにしかしなかった？）

今までのブラウザの挙動がおかしいのか、IE8の挙動がおかしいのかはちょっと現段階ではわからない。
時間があるときに調べよう。