Definición de .grid-auto-flow aplicado en CSS
La propiedad CSS .grid-auto-flow
es parte de la especificación de diseño de cuadrícula CSS que nos permite controlar el flujo de elementos de la cuadrícula que se colocan automáticamente cuando no se colocan explícitamente con ninguna propiedad de colocación de cuadrícula.
Ejemplo de empleo de grid-auto-flow
Esta propiedad de CSS habitualmente se utiliza de la siguiente manera:
.grid-container {
display: grid;
grid-template-columns: repeat(8, 50px);
grid-auto-flow: dense;
}
Sintaxis de .grid-auto-flow en CSS
grid-auto-flow: row|column|dense|row dense|column dense;
Valores
Valor | Descripción | Manifestación |
---|---|---|
fila | Valor por defecto. Coloca artículos llenando cada fila | |
columna | Coloca artículos llenando cada columna | |
denso | Coloque elementos para llenar los agujeros en la cuadrícula | |
fila densa | Coloca los elementos llenando cada fila y llena los agujeros en la cuadrícula | |
columna densa | Coloca los elementos llenando cada columna y llena los agujeros en la cuadrícula |
Exploradores compatibles con .grid-auto-flow
Los números de la tabla detallan la primera versión del navegador que es absolutamente compatible con la propiedad.
Los números seguidos de -webkit- detallan la primera versión que funcionó con un prefijo.
Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
grid-auto-rows | 57 | 16 | 52 | 10 | 44 |