Easy Tutorial
❮ Met Loc Reload Jsref Getutcfullyear ❯

flexDirection Property

Style Object

Example

Rearrange the direction of flexible items within a <div> element:


Definition and Usage

The flexDirection property sets or returns the direction of the flexible items.

Note: The flexDirection property has no effect if the element is not a flexible item.


Browser Support

Firefox, Opera, and Chrome support the flexDirection property.


Syntax

Return the flexDirection property:

Set the flexDirection property:

Property Values

Value Description
row Default value. Flexible items are displayed horizontally, like a row.
row-reverse Same as row, but in reverse order.
column Flexible items are displayed vertically, like a column.
column-reverse Same as column, but in reverse order.
initial Sets this property to its default value. See initial
inherit Inherits this property from its parent element. See inherit

Technical Details

Default Value: row
Return Value: A string representing the flex-direction property of the element.
CSS Version CSS3

Related Articles

CSS Reference: flex-direction Property

HTML DOM STYLE Reference: flex Property

HTML DOM STYLE Reference: flexBasis Property

HTML DOM STYLE Reference: flexFlow Property

HTML DOM STYLE Reference: flexGrow Property

HTML DOM STYLE Reference: flexShrink Property

HTML DOM STYLE Reference: flexWrap Property


Style Object

❮ Met Loc Reload Jsref Getutcfullyear ❯