Eixo principal

O eixo principal num flexbox tem a direção definida pela propriedade flex-direction. Esta propriedade pode ter os seguintes valores:

  • row
  • row-reverse
  • column
  • column-reverse

Quando o valor é row ou row-reverse ou eixo principal fica na horizontal, ao longo de cada linha.

In this image the flex-direction is row which forms the main axis

Quando o valor é column ou column-reverse o eixo principal fica na vertical, ao longo dos blocos.

No eixo principal pode-se controlar o tamanho dos elementos flexíveis aumentando o espaço disponível para os próprios elementos, através da propriedade flex de cada um. Em alternativa, pode-se controlar o espaço entre/à volta dos elementos com a propriedade justify-content.

Aprender mais

Referência das propriedades

Aprofundar