From the course: CSS Essential Training

Unlock the full course today

Join today to access over 23,200 courses taught by industry experts.

Flexbox: Orientation and ordering

Flexbox: Orientation and ordering - CSS Tutorial

From the course: CSS Essential Training

Start my 1-month free trial Buy for my team

Flexbox: Orientation and ordering

“

- [Instructor] One useful feature of Flexbox is its ability to align items in either rows or columns. The flex-direction property controls the direction of the main axis and also the order of the items. It has four possible values. Row, row-reverse, column, and column-reverse. This property is added to the flex container. Row is the default value. The main start and main end depends on the writing mode of the document. In left-to-right languages like English, main start and main end runs from left to right. In right-to-left languages like Arabic, main start and main ends runs from right to left. Using the column value with flex-direction changes the main axis to a vertical direction. This displays the flex items in a column with each item stacked on top of each other. The main start and main end properties run from top to bottom and expand to the width of their container. The direction of the main start and main end can…

Contents