Atributo bottom CSS

Definición y uso

La propiedad bottom especifica el borde inferior del elemento. Esta propiedad define el desplazamiento de la márgen inferior del borde exterior del elemento de posición con el borde inferior del contenedor.

Notas:Si el valor del atributo "position" es "static", la configuración de la propiedad "bottom" no tendrá ningún efecto.

Descripción

Para elementos estáticos, es auto; para valores de longitud, es la longitud absoluta correspondiente; para valores en porcentaje, es el valor especificado; de lo contrario, es auto.

Para elementos definidos en relativo, si bottom y top son auto, sus valores calculados son 0; si uno de ellos es auto, se toma el opuesto del otro valor; si ambos no son auto, bottom toma el opuesto del valor de top.

Véase también:

Tutoriales de CSS:CSS Posicionamiento

Manual de referencia de HTML DOM:Propiedad bottom

Ejemplo

Establece el borde inferior de la imagen en una posición 5 píxeles superior a la del borde inferior del contenedor:

img
  {
  position:absolute;
  bottom:5px;
  }

Prueba por ti mismo

Sintaxis de CSS

bottom: auto|longitud|initial|inherit;

Valor del atributo

Valor Descripción
auto Valor por defecto. La posición inferior se calcula mediante el navegador.
% Configura la posición del borde inferior del elemento en porcentajes del ancho del contenedor. Se pueden usar valores negativos.
longitud Configura la posición del borde inferior del elemento utilizando unidades como px, cm, etc. Se pueden usar valores negativos.
inherit Define que el valor de la propiedad bottom debe ser heredado del elemento padre.

Detalles técnicos

Valor por defecto: auto
Herencia: no
Versión: CSS2
Sintaxis de JavaScript: object.style.bottom="50px"

Más ejemplos

Configuración del borde inferior de la imagen con valores en píxeles
Este ejemplo muestra cómo configurar el borde inferior de la imagen utilizando valores en píxeles.
Configuración del borde inferior de la imagen con porcentajes
Este ejemplo muestra cómo configurar el borde inferior de la imagen utilizando porcentajes.

Compatibilidad del navegador

Los números en la tabla indican la primera versión del navegador que admite completamente esta propiedad.

Chrome IE / Edge Firefox Safari Opera
1.0 5.0 1.0 1.0 6.0