Muy buenas,
Sigo con la Web que tantos quebraderos de cabeza está dandome, al tiempo que
me enseña lo que no sabía de CSS...
Resulta que el diseño es a 3 columnas con cabecera y pie de página.
El primer problema con el que me he encontrado es conseguir que el diseño de
ambas columnas ocupe el 100% del contenido (div contenido), pero no
necesariamente el 100% del navegador.
El segundo es conseguir que el pie de pagina (div pie) esté siempre centrado
y abajo del todo, independientemente de cuánto contenido haya en la parte
central.
Y el "problema" es que el pie de página no va debajo de las columnas u
ocupando la misma anchura que columna1+centro+columna2. En este caso el pie
de página va en el contenido, en el centro, y situado entre las dos
columnas.
Algo así:
______________________________________
| cabecera |
|________________________________|
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| |________________| |
| col1 | pie de pagina | col2 |
-------------------------------------------------------------------
He conseguido maquetar bien el tema de cabecera, columnas, contenido, y que
quede centrado en la Web a tamaño fijo de 780px, pero no se cómo hacer que
el pie salga centrado.
Antes lo tenía puesto después de la div de contenido, con un "clear: both"
(tampoco sé exactamente qué hace, pero me sirvió para que se centrase bien,
pero claro, los menús se cortaban antes.. de la siguiente forma:
______________________________________
| cabecera |
|________________________________|
| | | |
| | | |
| | | |
| | | |
| col1 | | col2 |
| | | |
| | | |
|_______|________________|_______|
| pie de pagina |
-----------------------------------
He mirado múltiples ejemplos de paginas a 3 columnas + header+ footer, pero
ninguna me ha sido útil... ¿no hay una forma "sencilla" de decirle al
navegador mediante CSS algo así como "esta div la quiero abajo del todo y
dentro de esta otra div"?
La estructura actual de la web sería algo así:
Div contenido
Div cabecera
Div barra1
Div menuopciones /div
Div modulo1 /div
Div modulo2 /div
Div modulo3 /div
/div
Div barra2
Div modulo1 /div
Div modulo2 /div
Div modulo3 /div
Div modulo4 /div
/div
Div cuerpo
Div datos /div
/div
/div
Div pie /div
Al tema modulos no le hagáis mucho caso... son los diferentes Divs que
utilizo para hacer includes con PHP.
Contenido para mí representa a toda la "caja" donde está la Web.
Cuerpo sería la parte central, donde se va a alojar el contenido.
Datos es otra "subdiv" de Cuerpo... supongo que no es necesaria, pero la he
metido porque Cuerpo ocupa 500px y los Datos (otro include PHP) debía ocupar
480px.
El pie, como veis, está después de todo. No es el sitio correcto supongo...
la situación "ideal" sería meterlo debajo de "Cuerpo", con alguna propiedad
que le diga que se quede abajo...
Pero no encuetro la forma. ¿Alguna idea?
Ah, y lo del 100% de altura de las columnas... Curiosamente Explorer me lo
hace bien (puse height: 100%), pero FireFox no... queda algo así
______________________________________
| cabecera |
|________________________________|
| | | |
| | | |
| | | |
| | | |
| col1 | | col2 |
| | |_______|
| | |
|_______|________________|
(Ya que el contenido de "col2" es menor que el de "col1")
Gracias de antemano,
Un saludo.
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo_ovillo.org
