Todo mundo sabe sobre elementos de compensação; aquele comportamento CSS irritante em que os elementos flutuantes não afetam a altura do elemento que os contém. Ao adicionar um div de compensação, forçamos esse comportamento.
<div class="parent">
<div style="float:left;">Some left aligned content</div>
<div style="float:right;">Some right aligned content</div>
<div style="clear:both;"></div>
</div>Uma técnica muito menos conhecida, e algo que eu uso 9 em cada 10 vezes onde esse comportamento ocorre, é apenas dar ao elemento pai um estilo de estouro de ‘oculto’.
<div class="parent" style="overflow:hidden">
<div style="float:left;">Some left aligned content</div>
<div style="float:right;">Some right aligned content</div>
</div>Isso forçará o elemento pai a se expandir até a altura dos elementos filho, eliminando a necessidade de um elemento de limpeza não semântico desnecessário.