Características flex-flow en CSS

Características flex-flow en CSS

La propiedad flex-flow utiliza una propiedad abreviada de CSS para establecer el valor de flex-directionflex-wrap.

Funciones flex-flow css

Valor inicialPara cada valor corto:
flex-directionrow
flex-wrapnowrap
Aplicado aContenedores flexibles.
HeredableNo
MóvilNo
Valor calculadoPara cada valor corto:
flex-direction: Como se especificó.
flex-wrap: Como se especificó.
/* 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> y <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;

Ejemplos y aplicaciones en código

Consulte las propiedades de la página flex-directionflex-wrap ejemplos detallados de su uso.

Soporte de navegadores

CaracterísticaChromeFirefoxIEÓperaSafari
Soporte básico29,020,01112,59.0

Las versiones anteriores de algunos navegadores (como Chrome, IE y Safari) admitían flexbox pero con un uso anterior ( -webkit--ms-).

Características general

La propiedad acepta flex-flow uno o dos de los siguientes valores.

<flex-direction>

Este valor define cuál es el eje principal en el contenedor flexible y su orientación. Consulte la página de funciones flex-direction para obtener más información.

<flex-wrap>

Esta propiedad especifica si los elementos flexibles deben estar contenidos en una sola línea o pueden ajustarse a varias líneas. Consulte la página de funciones flex-wrap para obtener más información.

Estructura flex-flow css

flex-flow: <'flex-direction'> || <'flex-wrap'>;

Consulte también

  • Página de sub-propiedades que esta conjuntos de propiedades son: flex-basisflex-directionflex-growflex-shrinkflex-wrap.
  • La página de cada una de las propiedades  widthheight que se encarga de configurar las dimensiones del elemento.
  • La página de propiedades position que describe cómo se debe colocar el elemento en el documento.