[css]floatを使ったらclearを

以下のような html に対して、css で

#hogehoge {background: #00f;}

と指定しても何故か反映されなくて１時間悩みました。

<div id="hogehoge">

 <p>あいうえお</p>

</div>

firebug で見ると、「あいうえお」のある所じゃないところがhogehoge と認識されています。

firefox のエラーコンソールやw3c の validator チェックをかけてもエラーは出ません。

あれこれと試行錯誤を繰り替えしたところ、どうやら、float したものをちゃんと clear しないとあっちこっちでおかしくなるようです。

というわけで、float を使ったら clear を！！