floatを解除するために、clearfixでfloat要素を囲うのは結構有名な話。
で、そのclearfixの記述には諸説あるが、自分が調べた中ではこれが一番簡単。
.clearfix:after {
content: "";
display: block;
clear: both;
}
たった3行。これで大概のブラウザはfloat要素をブロックとして認識してくれる。
<div class="clearfix">
<div style="float:left;">・・・</div>
<div style="float:left;">・・・</div>
</div>
みたいな感じで使えばOK。
これを覚えるまでは、float要素の最後に、
<div>
<div style="float:left;">・・・</div>
<div style="float:left;">・・・</div>
<div style="clear:both;"></div>
</div>
といった空のdivタグを入れていた。今見るとなんという恥ずかしいコーディング…（汗