Fő- és keresztirányú tengelyek a CSS flex blokkokban

A flexboxokról kétféle terminológiában beszélhetünk: az első a sor vagy oszlop, a második a tengelyek terminológiája. A sorokkal és oszlopokkal már foglalkoztunk, most pedig foglalkozzunk a tengelyekkel. A tengelyek megértése azért szükséges, hogy vízszintesen vagy függőlegesen tudjunk elemeket igazítani.

Flex elemekkel dolgozva mindig létezik főtengely és keresztirányú tengely. Az elemeket a fő tengely mentén és a főtengelyre merőlegesen is igazíthatjuk. A főtengely 4 irányú lehet: balról jobbra, jobbról balra, fentről lefelé és lentről felfelé.

A keresztirányú tengely iránya a főtengely irányától függ: ha a főtengely vízszintes, akkor a keresztirányú tengely fentről lefelé mutat, ha a főtengely függőleges, akkor a keresztirányú tengely balról jobbra mutat. A keresztirányú tengely más irányú nem lehet.

A főtengely irányát a flex-direction tulajdonság szabályozza. Ha ennek a tulajdonságnak az értéke row - a főtengely iránya balról jobbra, ha az értéke row-reverse, akkor jobbról balra. A column érték fentről lefelé irányítja a tengelyt, az column-reverse érték pedig lentről felfelé.