Hola
yuo2.
prueba con:
1 - dar overflow:hidden; a la capa que contiene elementos flotados.
2 - quitar height:auto; a la capa #cuerpo{}
Debería quedarte así:
Código CSS:
Ver original#cuerpo{
position: relative;
width: 800px;
background-color: #FF0000;
background-repeat: repeat-x; /*esto también está demas, pues no tienes ninguna imagen a repetir*/
overflow:hidden;
}
Esta técnica se conoce como
"limpiar los float" y hace referencia al problema de que la caja padre no toma la altura de su contenido, cuando este esta formado por cajas flotadas.
P/D:
También, para el mismo fin, se puede incluir un div vacío debajo de la capa que contiene los elementos flotados y hacer uso de la propiedad clear:
<div style="clear: both"></div>
Aunque aconsejan usar overflow:hidden.
Espero te sirva esta info. En el enlace puedes estudiarlo más en detalle. Un abrazo.