clearfix

Comentan mis excompañeros de Pixelinglife (Observer) un truco para conseguir terminar una serie de floats de forma que el siguiente elemento se ubique bajo ellos. La forma habitual de hacerlo implica crear un elemento div vacío con el estilo clear establecido (both, left o right). Pues bien, si se le asigna la clase clearfloat al último elemento float se conseguirá el mismo resultado, definiendo dicha clase de la siguiente forma:

.clearfix:after
{
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

Como se puede ver, estamos usando la pseudo-clase :after para generar automáticamente un elemento con el mismo resultado.