CSS: "Haciendo" un float:bottom

viernes, 23 de noviembre de 2012 Etiquetas: ,

Introducción

Hay ocasiones que queremos que en nuestra página web un elemento que se visualice siempre en la parte inferior de su contenedor. Si nunca te ha surgido la necesidad, tiempo al tiempo... Creo que lo primero que se prueba, ya te adelanto el resultado: no funciona, es lo siguiente:



#elemento{
  float:bottom;
}

Pero como ya he comentado no funciona. La solución por suerte es bastante sencilla. Vamos a ver como realizarlo.

Solución

La solución pasa por poner el elemento en position absolute e indicar la distancia al final mediante bottom. No hay que olvidar poner el contenedor en position relative, sino no funcionará. El código queda así:

#container{
  position:relative;
}

#elemento{
  position:absolute;
  bottom:0px;
}
Quedará algo así:

Contendor
Posicionado al final

0 comentarios:

Publicar un comentario