Esta artículo, “All about floats”, de Chris Coyier va camino de tener un año pero es bastante probable que, si andas buscando en google soluciones a tus problemas con los “floats” en CSS te lo encuentres una y otra vez.

Eso mismo me pasó ayer, cuando me lo reencontré mientras trataba de dar con una salida a un pequeño conflicto en un div con todos los elementos interiores “flotados” (y no es la primera vez que me pasa y encuentro la misma solución pero no llamé “la mala memoria” a esta página por nada).

Por lo general, cuando todos los elementos interiores de un div están flotados, el div no calcula por si solo la altura del mayor de sus elementos internos sino que colapsa a la altura del mayor de los elementos con una altura definida o bien desaparece por completo si ninguno tiene una altura declarada en CSS. La solución es muy sencilla, es suficiente con aplicar un overflow:auto al div superior para que este reaparezca en todo su esplendor. Obviamente no nos sirve si necesitamos que ese overflow tenga otro valor por alguna razón pero en la mayor parte de los casos es un muy buen recurso.

El artículo original que os enlacé al principio nos ofrece una buena introducción a los “floats” que es una de las herramientas más versátiles del CSS y a la vez una de las que más dolores de cabeza da si no se entiende bien.