Mantener el Footer Adherido al borde inferior de la pagina

Heiroon · #1 (**permalink**) 07/04/2011, 08:29

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...

maycolalvarez · #2 (**permalink**) 07/04/2011, 09:33

simple CSS como la barra de chat en facebook:

Código CSS:

Ver original.footer{
    bottom: 0;
    position: absolute;
}

IsaBelM · #3 (**permalink**) 07/04/2011, 10:29

ya que es a modo didáctico alguna explicación mas

frank_harbey12 · #4 (**permalink**) 07/04/2011, 13:58

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.

Heiroon · #5 (**permalink**) 08/04/2011, 12:31

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!

Heiroon · #6 (**permalink**) 08/04/2011, 13:47

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!