flex-flow property

Author admin Reading 1 min Views 407 Published by July 9, 2012 Modified by September 19, 2024

Contents

Definition and Usage
Syntax
Values
Examples
Compatibility
Desktop browsers
Mobile browsers

Definition and Usage

The CSS flex-flow property is a shorthand property for flex-direction and flex-wrap individual properties.

Initialthe concatenation of the initial values of its longhand properties:
- flex-direction: row
- flex-wrap: nowrap
Applies toflex containers
Inheritedno
Mediavisual
Computed Valueas each of the properties of the shorthand:
- flex-direction: as specified
- flex-wrap: as specified
Animatableno
Canonical orderorder of appearance in the formal grammar of the values

Syntax

Formal syntax: <'flex-direction'> || <'flex-wrap'>

Values

See flex-direction and flex-wrap for details on the values.

Examples

element { 
  
  /* Main-axis is the block direction with reversed main-start and main-end. Flex items are laid out in multiple lines */ 
  
  flex-flow: column-reverse wrap; 
  
}