CSSでFloatを使った場合、ほとんどの場合でfloatを解除する必要があります。
何年か前は解除したいところに、divタグを作って、そこにclear:both;をCSSで設定するようにしていました。
しかし、html的に不必要なDIVタグを作るのもどうか？ってことで作られた物の一つがclearfixになります。

使い方は簡単！
CSSに以下のコードを書いておいて、フロートを掛けている要素の親要素のクラス名に対して「clearfix」を追加するだけ。
そうすると、親要素が閉じる前に自動的にclearさせる要素をこっそり作って、そこでフォローを解除してくれます。

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
* html .clearfix {
	height: 1px;/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}