Eixo transversal

Numa flexbox, ou eixo transveral é perpendicular ao main axis, o que significa que se a direção for ao longo de uma linha (ou seja, flex-direction (en-US) é row ou row-reverse) então o eixo transversal estende-se ao longo das colunas.

Se por outro lado a direção for ao longo das colunas (flex-direction (en-US) é column or column-reverse) então este eixo estende-se ao longo das linhas.

Alinhamento de elementos no eixo transversal faz-se com a propriedade align-items no contentor flexível ou com a propriedade align-self em elementos individuais. No caso de um contentor com várias linhas, que tenha espaço adicional no eixo transversal, pode-se utilizar align-content para controlar o espaçamento das linhas.

• CSS Flexbox Guide: Basic Concepts of Flexbox
• CSS Flexbox Guide: Aligning items in a flex container
• CSS Flexbox Guide: Mastering wrapping of flex items