Tamaño del Div que anida a dos Divs

[nuebe]

Buenas.

lo primero comentar que he estado buscando por el foro y por google, como hacer lo que quiero, pero no lo he encontrado.

Tengo un div que contiene a otros dos mas. Estos dos estan con float, y al estar con esta caracteristica, el que los contiene no aparece o se queda arriba. y el 4 div, no pinta mucho la verdad.

Una opcion seria en vez de darle un float left al 1 contenido, darle el float left al segundo y un margen de lo que mida el 1, pero el de la derecha se me descuadra.

Código:

#este { width:auto;}
#1 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:100px; height:200px; float:left;}
#2 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:250px; height:250px; margin-left:140px; position: }
#3 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:100px; height:200px; float:right; }

Pero si lo pongo todos con float, unos a la derecha y otros a la izquierda, #este desaparece

Código:

#este { width:auto;}
#1 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:100px; height:200px; float:left;}
#2 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:250px; height:250px; float:left;}
#3 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:100px; height:200px; float:right; }

Este el el html

Código HTML:

<div id="este">
	<div id="1">1</div>
	<div id="2">2</div>
</div>
<div id="3">3</div> 

Se que una vez lo saque, pero fue metiendo otro div debajo del div 2. Pero lo queria hacer sin meter mas divs.

Lo que pretendo es que el div #este sea tan largo como 1 o 2

Muchas gracias

[hades87]

podrías poner un dibujo de como quieres la estructura?:P

[nuebe]

Vale, ya lo tengo. Despues de ir mirando los posts 1x1 lo he visto de casualidad.

Me faltaba el float left en el div #este

asi:

#este { float:left;}
#1 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:100px; height:200px; float:left;}
#2 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:250px; height:250px; float:left;}
#3 { background:#CCC; border:#666 1px solid; margin:10px; padding:10px; width:100px; height:200px; float:right; }

[hades87]

jeje me alegro que lo hayas solucionado :P