Tip: Clearing Float Without an Extra Div or BR Tag

By adding two additional css properties to the container div, you don't need an extra tag to clear the float. Look at the three css classes below

<style>
div.container {
	border: 1px solid #000000;
	overflow: hidden;
	width: 100%;
}

div.left {
	width: 45%;
	float: left;
	background:#F6C;
}

div.right {
	width: 45%;
	float: right;
	background:#6FF;
}

</style>

And the following markup

<div class="container">
    <div class="left">&nbsp;</div>
    <div class="right">&nbsp;</div>
</div>

The div.container class has overflow:hidden and width:100%, by adding these two properties in the container div, clearing float is not required and you will see a border around the container div indicating no need to clear float