Justify-content

Justerar hur en flexbehållares innehåll placeras ut längs med flexaxeln. Se denna sektion för mer utförlig information.

Egenskaper

Parametrar	flex-start | flex-end | center | space-between | space-around
Defaultvärde	flex-start
Ärvs?	Nej
Animerbart?	Nej
Fungerar med...	Flexbehållare

flex-start flexinnehållets toppkant fördelas och justeras mot flexaxelns start.

flex-end flexinnehållets bottenkant fördelas och justeras mot flexaxelns slut.

center flexinnehållet fördelas och justeras mellan flexaxelns start och slut.

space-between De två yttersta flexföremålen, placeras vid flexaxeln början respektive start. Därefter fördelas övriga flexföremål mellan dessa yttersta flexföremålen. De fördelas så att det är lika mycket mellanrum mellan alla flexföremål.

space-around Flexföremålen fördelas så att det är lika mycket mellanrum mellan alla flexföremål. Utanför de yttersta flexföremålen sätts tomrummet så att det är hälften så stort som motsatta sidas tomrum.

Exempel

Exempel.

See the Pen waLgqO by Patrik Grip-Jansson (@PGJ) on CodePen.

Egenskapens definition

https://drafts.csswg.org/css-flexbox-1/#justify-content-property