El float en el div, recorta el tamaño del div que contiene ese div

[Dani392]

Hola,

Tengo un div (numero1) que tiene dentro dos divs. Estos dos divs están en float, uno a la derecha y otro a la izquierda. El resultado es que el div (numero1) es más corto que la altura que marcan los otros dos div.

¿Qué puedo hacer?

[willyfc]

si quieres utilizar un div contenedor y dos flotando dentro sería así:

Código:

#contenedor{ width:800px; height:auto; margin:0 auto; background-color:#666666; display:table}
#izquierda{ float:left; width:350px; height:auto; background-color:#333333; color:#FFFFFF; margin:20px 0 10px 49px;}
#derecha{float:right; width:350px; height:auto; background-color:#333333;color:#FFFFFF; margin:20px 49px 10px 0;}

Código HTML:

<div id="contenedor">
	<div id="izquierda">
	asdfsadfasdf
	</div>
	<div id="derecha">
	asdfasdfasdf
	</div>
</div> 

lo veras deformado o que una columna es mas grande que la otra solo en el diseño con esta estructura puedes usar una imagen de fondo que se repite sin importar cuanto midan las columnas de alto y tampoco importa si una es mas larga que la otra

Espero haberte ayudado.

[Dani392]

Gracias, ha funcionado gracias al display: table

¿Qué hace el display: table?

[willyfc]

que bueno que te sirvió

el display table hace que un div se comporte como si fuera una tabla hace que el todo lo que esta dentro de el parezca que crece parejo, lee esto te ayudará a entender lo que hace la amplia propiedad display.

http://www.librosweb.es/referencia/css/display.html