flex-direction

christian.dinh2481 total contributions
Published Jul 23, 2021Updated Sep 3, 2021
Contribute to Docs
A property that specifies the direction in which elements are distributed within a container.
Syntax
#element-container {display: flex;flex-direction: <flex-value>;}
The <flex-value>
can be one of four options:
- Elements arranged left to right:
row
- Elements arranged right to left:
row-reverse
- Elements arranged top to bottom:
column
- Elements arranged bottom to top:
column-reverse
Example 1
Content that is arranged horizontally within a container:
#spam-container {display: flex;flex-direction: row;}
All contributors
- christian.dinh2481 total contributions
- Anonymous contributorAnonymous contributor3077 total contributions
- Anonymous contributorAnonymous contributor92 total contributions
- christian.dinh
- Anonymous contributor
- Anonymous contributor
Looking to contribute?
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.