Resumen
La propiedad CSS flex-flow es una prpoiedad taquinográfica para las propiedades individuales flex-direction y flex-wrap.
| Valor inicial | as each of the properties of the shorthand:
|
|---|---|
| Applies to | flex containers |
| Heredable | no |
| Media | visual |
| Valor calculado | as each of the properties of the shorthand:
|
| Animatable | no |
| Canonical order | order of appearance in the formal grammar of the values |
Para más propiedades e información ve Utilizando cajas flexibles CSS.
Sintaxis
/* 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'> and <'flex-wrap'> */ flex-flow: row nowrap; flex-flow: column wrap; flex-flow: column-reverse wrap-reverse; /* valores globales */ flex-flow: inherit; flex-flow: initial; flex-flow: unset;
Valores
Ve flex-direction y flex-wrap para más detalles de los valores.
Sintaxis formal
<'flex-direction'> || <'flex-wrap'>
Ejemplos
element {
/* Main-axis es la dirección de bloque con main-start y main-end opuesto. Los artículos flex se distribuyen en múltiples líneas */
flex-flow: column-reverse wrap;
}
Especificaciones
| Especificación | Estado | Comentario |
|---|---|---|
| CSS Flexible Box Layout Module The definition of 'flex-flow' in that specification. |
Last Call Working Draft | Definición inicial |
Compatibilidad de navegador
| Característica | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Soporte básico | 28.0 | 21.0-webkit 29.0 |
11 | 12.10 | 6.1-webkit |
| Característica | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Soporte básico | 28.0 | ? | 11 | 12.10 | 7.1-webkit |