flex-direction

The flex-direction CSS property sets how flex items are placed in the flex container defining the main axis and the direction (normal or reversed).

The flex-direction property enables you to define how flex items are placed in a flex container by setting the container’s main axis and the direction of the flex items. This property is relevant only on container elements that have their display property set to flex or inline-flex. The flex-direction property, along with the flex-wrap property, should be set using the flex-flow shorthand.

When set on a flex container, the flex-direction property defines whether the flex items are laid out in the same direction or perpendicular to the text direction, and whether the items are laid out normally or reversed.

Syntax example: flex-direction: row;