Limpando flutuadores 2.0

Então sempre tive o problema de ter um div float à esquerda e outro à direita apenas para ter que usar o div clássico com uma classe de clear: ambos nele apenas para ter um pequeno preenchimento na parte inferior dos divs, bem, isso não é mais um problema se você usar o código a seguir.

Portanto, a maneira antiga era adicionar o claro: ambas as classes a um div abaixo dos divs flutuantes

<div class="clear:both"></div>

Mas esse novo método não precisa disso, pois tudo o que você precisa fazer é envolver seus divs flutuantes em outro div como abaixo.

.container { overflow:hidden; width:100%; }
.left { width:50%; float:left; background-color:#333; }
.right { width:50%; float:right; background-color:#666; }

Portanto, você teria seu código da seguinte forma:

<div class="container">
<div class="left">Text here...</div>
<div class="right">Text here...</div>
</div>

E aí você vai, não vai mais limpar seu div e ter aquele pouco de preenchimento na parte inferior dele ..!