Hoved- og tværakse i flex-blokke i CSS

Man kan tale om flexbokse i to termer: det første er - række eller kolonne, det andet - i termer af akser. Vi har allerede kigget på rækker og kolonner, lad os nu kigge på akser. Forståelse af akser er nødvendig for at justere elementer vandret eller lodret.

Ved arbejde med flex-elementer eksisterer der altid en hovedakse og en tværakse. Vi kan justere elementer langs hovedaksen og på tværs af hovedaksen. Hovedaksen kan have 4 retninger: fra venstre mod højre, fra højre mod venstre, fra top til bund og fra bund til top.

Retningen af tværaksen afhænger af hovedaksens retning: hvis hovedaksen er vandret, så er tværaksen rettet fra top til bund, hvis hovedaksen er lodret, så er tværaksen rettet fra venstre mod højre. Andre retninger kan tværaksen ikke have.

Retningen af hovedaksen styres af egenskaben flex-direction. Hvis denne egenskab har værdien row - er hovedaksen rettet fra venstre mod højre, hvis værdien er row-reverse, så fra højre mod venstre. Værdien column retter aksen fra top til bund, og værdien column-reverse - fra bund til top.