flex-flow Redirect 1

Summary

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

  • Initial value the concatenation of the initial values of its longhand properties:
    • flex-direction: row
    • flex-wrap: nowrap
  • Applies to flex containers
  • Inherited no
  • Media visual
  • Computed value as each of the properties of the shorthand:
    • flex-direction: as specified
    • flex-wrap: as specified
  • Animatable no
  • Canonical order order of appearance in the formal grammar of the values

See Using CSS flexible boxes for more properties and information.

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;            
}

Specifications

Specification Status Comment
CSS Flexible Box Layout Module Candidate Recommendation  

Browser compatibility

Feature Firefox (Gecko) Chrome Internet Explorer Opera Safari
Basic support 28.0 21.0-webkit 11 12.10 Not supported
Feature Firefox Mobile (Gecko) Android IE Phone Opera Mobile Safari Mobile
Basic support 28.0 ? Not supported 12.10 Not supported

See also

Document Tags and Contributors

 Contributors to this page: Sheppy
 Last updated by: Sheppy,