Atributo align-items de CSS

Definición y uso

align-items Atributo para especificar el alineamiento predeterminado de los elementos dentro del contenedor flexible.

Consejo:Utilice el atributo de cada proyecto align-self Atributos para sobrescribir este alignItems.

Vea también:

Tutoriales de CSS:CSS Grid

Tutoriales de CSS:CSS Flexbox

Manual de referencia de CSS:Atributo alignContent

Manual de referencia de CSS:Atributo alignSelf

Manual de referencia de CSS:Atributo justifyContent

Manual de referencia de CSS:Atributo justifyItems

Manual de referencia de CSS:Atributo justifySelf

Manual de referencia de HTML DOM:Atributo alignItems

Ejemplo

Alinear al centro todos los elementos del elemento <div> flexible:

div {
  display: flex;
  align-items: center;
}

Pruebe usted mismo

Sintaxis de CSS

align-items: stretch|center|flex-start|flex-end|linea_base|initial|inherit;

Valor del atributo

Valor Descripción
stretch Predeterminado. El elemento se estira para ajustarse al contenedor.
center El elemento se encuentra en el centro del contenedor.
flex-start El elemento se encuentra en el extremo izquierdo del contenedor.
flex-end El elemento se encuentra en el extremo derecho del contenedor.
linea_base El elemento se coloca en la línea base del contenedor.
initial Establezca este atributo en su valor predeterminado. Vea initial.
inherit Hereda este atributo del elemento padre. Vea inherit.

Detalles técnicos

Valor predeterminado: stretch
Herencia: No
Producción de animación: No se admite. Consulte:Atributos relacionados con la animación.
Versión: CSS3
Sintaxis de JavaScript: object.style.alignItems="center"

Compatibilidad del navegador

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
57.0 16.0 52.0 10.1 44.0