We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

Esta tradução está incompleta. Por favor, ajude a traduzir este artigo.

Resumo

A propriedade CSS flex-flow é uma junção das propriedades individuais flex-direction and flex-wrap.

Initial valueas each of the properties of the shorthand:
Aplica-se aflex containers
Inheritednão
Midiavisual
Computed valueas each of the properties of the shorthand:
Animation typediscrete
Canonical orderorder of appearance in the formal grammar of the values

Veja Using CSS flexible boxes para mais propriedades e informações.

Sintaxe

/* flex-flow: <'flex-direction'> */
flex-flow: row;
flex-flow: row-reverse;
flex-flow: column;
flex-flow: column-reverse;

/* flex-flow: <'flex-wrap'> */
flex-flow: nowrap;
flex-flow: wrap;
flex-flow: wrap-reverse;

/* flex-flow: <'flex-direction'> e <'flex-wrap'> */
flex-flow: row nowrap;
flex-flow: column wrap;
flex-flow: column-reverse wrap-reverse;

/* Global values */
flex-flow: inherit;
flex-flow: initial;
flex-flow: unset;

Valores

Veja flex-direction e flex-wrap para detalhes sobre seus valores.

Sintaxe Formal

<'flex-direction'> || <'flex-wrap'>

Exemplos

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

Especificações

Specification Status Comment
CSS Flexible Box Layout Module
The definition of 'flex-flow' in that specification.
Candidata a Recomendação Initial definition

Compatibilidade com navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

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

Veja também

Etiquetas do documento e colaboradores

Etiquetas: 
Colaboradores desta página: LeandroPS
Última atualização por: LeandroPS,