Foros del Web » Creando para Internet » CSS »

Web 3 filas - siempre en la misma posición

Estas en el tema de Web 3 filas - siempre en la misma posición en el foro de CSS en Foros del Web. Hola a todos. Tengo una duda... Necesito hacer un desarrollo que esté formado por: - DIV superior: cabecera (SIEMPRE con una altura predefinida en PIXELS) ...
  #1 (permalink)  
Antiguo 22/10/2010, 11:23
Avatar de el_javi  
Fecha de Ingreso: marzo-2005
Ubicación: MAdrid
Mensajes: 841
Antigüedad: 12 años, 8 meses
Puntos: 9
Web 3 filas - siempre en la misma posición

Hola a todos.

Tengo una duda...

Necesito hacer un desarrollo que esté formado por:
- DIV superior: cabecera (SIEMPRE con una altura predefinida en PIXELS)
- Justo debajo, el DIV central (con un vídeo, irá el flash embebido por Javascript)
- Abajo del todo (SIEMPRE PEGADO ABAJO) el pie de página. (SIEMPRE con una altura predefinida en PIXELS)

La cuestión es que las veces que he montado estos sistemas, el pie (footer) siempre, al redimensionar lapantall se me queda POR ENCIMA DE LOS CONTENIDOS centrales.. y en este caso NO PUEDE SER ASÍ.

es necesario que si redimensiono la ventana (o el usuario carga con diferentes resoluciones) el contenido central varíe su tamaño PERO el contenido de arriba se quede arriba y el de abajo, abajo.

No se si me he explicado...
Un ejemplo, sería esta Web: http://www.roosterinteractive.com/
Si, es Flash, pero esto es lo que necesito hacer en CSS.

¿Es posible?

Mil gracias!!!!!

Javier
  #2 (permalink)  
Antiguo 22/10/2010, 11:45
Avatar de dargorg  
Fecha de Ingreso: octubre-2010
Ubicación: Castellón (España)
Mensajes: 188
Antigüedad: 7 años, 1 mes
Puntos: 9
Respuesta: Web 3 filas - siempre en la misma posición

Tienes una solución aquí en CSS

http://www.lwis.net/profile/CSS/sticky-footer.html


Espero que te sea de ayuda,
  #3 (permalink)  
Antiguo 22/10/2010, 11:56
Avatar de el_javi  
Fecha de Ingreso: marzo-2005
Ubicación: MAdrid
Mensajes: 841
Antigüedad: 12 años, 8 meses
Puntos: 9
Respuesta: Web 3 filas - siempre en la misma posición

dargorg

Lo primero GRACIAS por tu pronta respuesta.

Lo segundo, me llegó tu anterior comentario (comentabas sobre Javascript y tal) y es una opción que tenía en mente desde el principio, pero quería consultarlo con vosotros a fin de que quizás aparecía una solución tan buena como la que has puesto.

Lo tercero: el enlace, está bastante bien, pero no cumple lo que yo necesito, dado que:
La capa de contenidos no tiene el 100% del alto del CENTRO... tiene un alto prefijado por los contenidos... o el que se le meta manualmente.

En mi caso, necesito que tenga la altura sobrante entre:
El total de alto navegador - la altura del header - altura footer.

Creo que realmente lo tendré que hacer con Javascript... No problemo!! pero buscaba a ver si existía una solución en CSS.

G4racias de nuevo.

Javier
  #4 (permalink)  
Antiguo 22/10/2010, 13:34
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Web 3 filas - siempre en la misma posición

Hace unos días, a raíz de una consulta sino igual a la suya, muy parecida, sugerí el siguiente layout:
http://bit.ly/ajv9gZ
Las alturas del header y footer están definidas en /em/, pero creo que no le supondrá mayor problema cambiarlas a /px/, y de anchura 100%, mientras que el cuerpo central o de contenidos está definido en /%/ con una anchura mínima para evitar colapsos a pequeñas resoluciones.
Si aumenta el contenido (pinche el enlace al efecto) el pie se desplaza para que se vean.
  #5 (permalink)  
Antiguo 22/10/2010, 13:39
Avatar de el_javi  
Fecha de Ingreso: marzo-2005
Ubicación: MAdrid
Mensajes: 841
Antigüedad: 12 años, 8 meses
Puntos: 9
Respuesta: Web 3 filas - siempre en la misma posición

Hola kseso?

Acabo de echarle un ojo a tu comentario.

Lo primero, gracias por la ayuda.

Lo segundo, he visto que en Internet Explorer 8, si redimensionas la ventana, se queda el pie deshubicado, sin subir ni bajar.....
Lo cachondo es que en Internet Explorer 6 si que funciona super correcto.

Lo voy a probar en el proyecto, a ver qué tal!!!!

Un saludo.

Javier
  #6 (permalink)  
Antiguo 22/10/2010, 13:52
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Web 3 filas - siempre en la misma posición

No tengo ie8, sólo lo puedo emular con ietester (con las dudas por lo tanto)
Pero no he observado ese efecto, así que no puedo reproducir el fallo.
Tampoco he visto malfuncionamiento en la ver 9 (beta).
Sí recuerdo que hay un min-width pero no los equivalentes para la familia de ie. Pero se podría suprimir (el min) asignando una anchura al h1, con los consiguientes ajustes.
  #7 (permalink)  
Antiguo 22/10/2010, 14:06
 
Fecha de Ingreso: octubre-2010
Mensajes: 66
Antigüedad: 7 años, 2 meses
Puntos: 7
Respuesta: Web 3 filas - siempre en la misma posición

A mi lo que no me falla nunca para hacer esto es footerStickAlt

http://www.themaninblue.com/writing/perspective/2005/08/29/

La única pega es que necesitas saber el alto del footer, por lo demás funciona a las mil maravillas
  #8 (permalink)  
Antiguo 22/10/2010, 17:20
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Web 3 filas - siempre en la misma posición

Cita:
Iniciado por hdennison Ver Mensaje
La única pega es que necesitas saber el alto del footer, por lo demás funciona a las mil maravillas
Para no desvirtuar este tema, decidí abrir uno nuevo donde se contempla esa situación: que la altura/contenidos del pie sean desconocidos a priori pero que se mantenga abajo sin forzar la aparición del scroll y con independencia del contenido del principal:
http://www.forosdelweb.com/f53/layou...8/#post3607809

Y porque posíblemente este último supuesto queda fuera de las premisas del post original.

Etiquetas: filas, siempre
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 11:55.