Specifying the Path

The flex-direction property switches the main axis. This changes the behavior of all other properties!

Role Switching:

row (default): Main axis is horizontal. justify-content moves elements left/right.
column: Main axis becomes vertical. Now justify-content moves elements up/down!

Values:

row-reverse: Direction change (right → left). Useful for RTL languages or changing button order.
column-reverse: Bottom to top. Perfect for comment threads.

Warning

When you change row to column, you " swap the strings " . Don't get confused: align-items now handles horizontal alignment!