Foros del Web - Ver Mensaje Individual - Encabezado, 3 columnas izquierda(divs) ¿y el pie?

ASYNTETYCO · #1 (**permalink**) 01/05/2008, 23:01

Bueno pues resulta que ya estoy entendiendo esto del css un poco. Hasta ahorita voy bien y maquetado esto y ya tiene contenido. Puse mi encabezado a 100% con una imagen alineada a la izquierda
Abajo puse 3 supuestas columnas(divs) una vacia de 25% x 400 para dar separacion, luego puse una con una imagen de 100 x 400(le di la medida de la imagen al div) y luego puse otro div de 600 x 400 (que es de un color mas obscuro y ahi quiero poner texto. Bueno hasta ahora ya lo probe en IE7 y Firefox y se ve bien. Por que esas 3 columnas(divs) las puse float: left y estan pegadas una con otra(todas pegadas a la izuierda claro y a la derecha hay un espacio vacio donde no hay div ni nada).

Ahora lo que quiero es meter un pie. Pero quiero que el pie quede debajo de ese cuadro de 600 x 400. y que se separe 25% de la izquierda asi como mi caja de texto. Es decir lo mismo de arriba pero abajo y con otro alto pero mas pequeño. Pero si le doy float left se me va a ir hasta arriba junto a la caja de texto, a la derecha de la caja de texto, por que hay un espacio donde deberia de ir una columna derecha(no la puse por que puse las 3 columnas una en porcentaje(25% x 400) y otra en pixeles(100x400) y mi caja de texto de 600 x 400 asi que no supe ponerle ancho).
¿Que hago, como le hago para poner mi pie hasta abajo.

Este es mi codigo:
<body>
<div id="encabezado"><img src="OXIGENO-Encabezado.gif" width="323" height="160" /></div>
<div id="separador" style="height: 10px"></div>
<div id="columnaizq" style="width: 20%; float:left; height: 400px;"></div>
<div id="Bienvenido" style="float:left; width: 100px; height: 400px;"><img src="Bienvenido.gif" width="100" height="400" /></div>
<div id="contenedor" style="float:left; width: 600px; height:400px; background-color: #FF2222; border-left: 1px dashed #EC0000; border-right: 1px dashed #EC0000;">
Colocar aquí el contenido de la nueva etiqueta Div</div>