Definición de .grid-auto-columns aplicado en CSS
La propiedad CSS .grid-auto-columns es parte de la especificación de diseño de cuadrícula CSS, especificando el tamaño de las columnas de la cuadrícula que se crearon sin tener un tamaño explícito. En otras palabras, esta propiedad establece el tamaño de las columnas implícitas y cualquier otra columna que no haya sido explícitamente dimensionada en la propiedad de columnas de plantilla de cuadrícula.
Caso de uso : propiedad CSS grid-auto-columns
Esta propiedad de CSS normalmente se utiliza de la siguiente manera:
.grid-container {
display: grid;
grid-template-areas: "media detail detail";
grid-template-columns: 200px 400px;
grid-auto-columns: 150px;
}Sintaxis de .grid-auto-columns en CSS
grid-auto-columns: auto|max-content|min-content|length;Valores
| Valor | Descripción | Manifestación |
|---|---|---|
| auto | Valor por defecto. El tamaño de las columnas está determinado por el tamaño del contenedor. | |
| ajuste-contenido() | ||
| contenido máximo | Establece el tamaño de cada columna según el elemento más grande de la columna | |
| contenido mínimo | Establece el tamaño de cada columna según el elemento más pequeño de la columna | |
| minmax(min.max) | Establece un rango de tamaño mayor o igual al mínimo y menor o igual al máximo | |
| longitud | Establece el tamaño de las columnas, utilizando un valor de longitud legal. | |
| % | Establece el tamaño de las columnas, usando un valor porcentual |
Exploradores compatibles con .grid-auto-columns
Los números de la tabla especifican la primera versión del navegador que es completamente compatible con la propiedad.
Los números seguidos de -webkit- especifican la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| grid-auto-flow | 57 | 16 | 52 | 10 | 44 |
