Foros del Web » Creando para Internet » CSS »

Mantener el Footer Adherido al borde inferior de la pagina

Estas en el tema de Mantener el Footer Adherido al borde inferior de la pagina en el foro de CSS en Foros del Web. Buenas colegas... Esta duda surgió de una petición que le hicieron a un compañero de trabajo... Aunque el titulo explica por si mismo, la pregunta ...
  #1 (permalink)  
Antiguo 07/04/2011, 09:29
Avatar de Heiroon  
Fecha de Ingreso: junio-2010
Ubicación: Caracas, Venezuela - Por ahora...
Mensajes: 495
Antigüedad: 7 años, 6 meses
Puntos: 63
Pregunta Mantener el Footer Adherido al borde inferior de la pagina

Buenas colegas... Esta duda surgió de una petición que le hicieron a un compañero de trabajo...

Aunque el titulo explica por si mismo, la pregunta es como hacer para que cuando se haga zoom (ctrl+mouse scroll) mantener el footer de una pagina pegado al bottom de la pagina...

Se perfectamente que esto no tiene utilidad en lo absoluto y es practicamente nulo solo el hecho de tomarlo en cuenta (cosa que el cliente no piensa). Sin embargo, tomandolo como un reto, me podrian ayudar a averiguar como se hace esto?

Aca les dejo el link de una pagina que hace lo que les digo:
http://www.unik.com/

Otra cosa, increiblemente... la pagina que les dejo se ven en explorer solamente. ( ni idea del porque). En otros exploradores no se ven los estilos...

Gracias! y espero puedan ayudarme con esto...
__________________
Gmail : [email protected]
Twitter: @heiroon

I'm back!
  #2 (permalink)  
Antiguo 07/04/2011, 10:33
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 9 años, 4 meses
Puntos: 1530
Respuesta: Mantener el Footer Adherido al borde inferior de la pagina

simple CSS como la barra de chat en facebook:

Código CSS:
Ver original
  1. .footer{
  2.     bottom: 0;
  3.     position: absolute;
  4. }
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #3 (permalink)  
Antiguo 07/04/2011, 11:29
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 9 años, 5 meses
Puntos: 1010
Respuesta: Mantener el Footer Adherido al borde inferior de la pagina

ya que es a modo didáctico alguna explicación mas
  #4 (permalink)  
Antiguo 07/04/2011, 14:58
 
Fecha de Ingreso: octubre-2010
Mensajes: 73
Antigüedad: 7 años, 1 mes
Puntos: 1
Respuesta: Mantener el Footer Adherido al borde inferior de la pagina

Mira si vas a crear una barra inferior has lo siguiente:

#bafoot{
margin-top: 95%; /*no coloco margin bottom por que en unos exploradores no aplica bien esta propiedad*/
width: 100%;
height: 5%;
position:absolute;
background: #000;
/*demas propiedades como border-radius box-shadow etc para darle un estilo mejor
}

ademas podes agregar dentro del div cualquier boton que desees etc, ademas te daras cuenta que si se realiza el zoom dicho div mantendra el aspecto, solo mira frontwebos.web.officelive.com ( si es mia y veras que al hacer zoom las imagenes se mantienen respecto a la pantalla (mi error esta en el texto por tal razon se agrandan las cosas.)

espero haberte servido de ayuda.
  #5 (permalink)  
Antiguo 08/04/2011, 13:31
Avatar de Heiroon  
Fecha de Ingreso: junio-2010
Ubicación: Caracas, Venezuela - Por ahora...
Mensajes: 495
Antigüedad: 7 años, 6 meses
Puntos: 63
Respuesta: Mantener el Footer Adherido al borde inferior de la pagina

Muchas gracias a todos por responder!! voy a probar las soluciones que me han dado a ver y les comento que tal.. de nuevo gracias!
__________________
Gmail : [email protected]
Twitter: @heiroon

I'm back!
  #6 (permalink)  
Antiguo 08/04/2011, 14:47
Avatar de Heiroon  
Fecha de Ingreso: junio-2010
Ubicación: Caracas, Venezuela - Por ahora...
Mensajes: 495
Antigüedad: 7 años, 6 meses
Puntos: 63
De acuerdo Respuesta: Mantener el Footer Adherido al borde inferior de la pagina

el reporte es el siguiente:

@maycolalvarez: Tu solucion era muy buena, pero al hacer ZoomIn, la barra se montaba sobre el contenido superior...

@frank_harbey12: Tambien una buena solución, de hecho, lo mismo que la anterior, pero un poco mas completa...

@IsaBelM: Revisando el enlace que me dejaste, consegui el codigo css que necesitaba! aca les dejo el enlace para quien lo necesite!

Muchisimas gracias a los tres por ayudarme a resolver este problema tan inverosimil hehehe

Saludos!
__________________
Gmail : [email protected]
Twitter: @heiroon

I'm back!

Etiquetas: adherido, bottom, footer
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 09:03.