Style flexFlowProperty
Style ObjectExample
Make the flexible items display as columns, and do not wrap:
Try it Yourself »
Definition and Usage
The flexFlow property is a shorthand property for the flexDirection and flexWrap properties.
The flexDirection property specifies the direction of the flexible items.
The flexWrap property specifies whether the flexible items should wrap or not.
Note:If the element is not a flexible item, the flexFlow property has no effect.
Browser Support
Firefox, Opera, and Chrome support the flexFlow property.
Syntax
Return the flexFlow property:
Set the flexFlow property:
Property Values
| Value | Description |
|---|---|
| flex-direction | Possible values: row row-reverse column column-reverse initial inherit Default value is "row". Specifies the direction of the flexible items. |
| flex-wrap | Possible values: nowrap wrap wrap-reverse initial inherit Default value is "nowrap". Specifies whether the flexible items should wrap or not. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default value: | row nowrap |
|---|---|
| Return value: | A string, representing the element's flex-flow property. |
| CSS Version | CSS3 |
Related Articles
CSS Reference Manual:flex-flow property
HTML DOM STYLE Reference Manual:flex property
HTML DOM STYLE Reference Manual:flexBasis property
HTML DOM STYLE Reference Manual:flexDirection property
HTML DOM STYLE Reference Manual:flexGrow property
HTML DOM STYLE Reference Manual:flexShrink property
HTML DOM STYLE Reference Manual:flexWrap property
Other Extensions