CSS align-items egenskap

Definition och användning

align-items egenskap för att specificera standardjustering för objekt inom ett elastiskt kontainer.

Tips:Använd varje objekts align-self egenskaper för att ersätta denna alignItems-egenskap.

Se också:

CSS Lär dig:CSS Grid

CSS Lär dig:CSS Flexbox

CSS Referenshandbok:align-content-egenskapen

CSS Referenshandbok:align-self-egenskapen

CSS Referenshandbok:justify-content-egenskapen

CSS Referenshandbok:justify-items-egenskapen

CSS Referenshandbok:justify-self-egenskapen

HTML DOM Referenshandbok:alignItems-egenskapen

Exempel

Centrera alla projekt i det elastiska <div>-elementet:

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

Prova själv

CSS-syntax

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

Egenskapsvärde

Värde Beskrivning
stretch Standard. Objektet sträcks för att passa behållaren.
center Objektet ligger i behållarens mitt.
flex-start Objektet ligger vid behållarens början.
flex-end Objektet ligger vid behållarens ände.
baseline Objektet placeras på behållarens baslinje.
initial Sätt detta egenskap till dess standardvärde. Se till: initial.
inherit Får detta egenskap från sina föräldrelement. Se till: inherit.

Tekniska detaljer

Standardvärde: stretch
Ärvning: Nej
Animationens skapande: Stöds inte. Se till:Animation relaterade egenskaper.
Version: CSS3
JavaScript-syntax: object.style.alignItems="center"

Webbläsarstöd

Tal i tabellen anger den första webbläsare som helt stöder detta egenskap.

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