NovaMonoFix
Errores PHP
X
Usuario
Password
0 FPS

Propiedad CSS : flex

26 de Diciembre del 2015 por Josep Antoni Bover379 visitas, 0 comentarios, 0 votos.
Categorías : CSS.
La web está en segundo plano, animación en pausa.
Cargando animación...

Esta propiedad es un atajo para las propiedades flex-grow, flex-shrink, y flex-basis.


Sintaxis

flex: grow shrink basis;

flex-grow

La propiedad flex-grow nos permite especificar el factor de crecimiento para un flex-item. De esta forma tenemos la habilidad de poder hacer crecer un flex-item especificando una proporción.

Por defecto es 0, si es 0 no se aplicará ninguna correción de tamaño al flex-item. En caso de no ser 0, el valor determina la proporción de espacio que debe utilizar un flex-item en relación con los demás flex-items.

No se puede especificar valores negarivos.


flex-shrink

La propiedad flex-shrink se utiliza para especificar factor de contracción de un flex-item.

Si el valor es 0, se utilizara el valor de flex-basis como referencia. En caso de que el valor no sea 0, especifica cómo el elemento se reducirá en relación con el resto de los elementos flexibles en el interior del mismo contenedor. Por defecto es 1.

No se puede especificar valores negarivos.


flex-basis

La propiedad flex-basis se utiliza para especificar el tamaño de un flex-item antes de distribuir el tamaño disponible según las normas del contenedor flexible.

Valor El valor puede ser cualquier tipo de unidad válido tanto relativo como absoluto (px, cm, em, %, etc...)
auto Se obtiene el valor basandose en el tamaño de su propio contenido. Este es el valor por defecto.


Código de ejemplo



Compatibilidad

Esta propiedad es soportada por todos los navegadores compatibles con CSS3.

Soportado a partir de la versión 29
Soportado a partir de la versión 20
Soportado a partir de la versión 12.1
Soportado a partir de la versión 6.1 con el prefijo -webkit-
Soportado a partir de la versión 11

Documento modificado por última vez : 26/12/2015
Ejemplo modificado por última vez : 13/12/2015

Enlaces relacionados