Resumen
La propiedad CSS flex-flow
es una propiedad atajo 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:
|
Animation type | discrete |
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
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 La definición de 'flex-flow' en esta especificación. |
Candidate Recommendation | Definición inicial |
Compatibilidad de navegador
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!
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 |