CSS grid-auto-columnsPropriété
Exemple
Définissez la taille par défaut des colonnes dans la grille::
.grid-container {
display: grid;
grid-auto-columns: 50px;
}
Essayez-le vous-même »
Prise en charge des navigateurs
Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge la propriété.
| Propriété | |||||
|---|---|---|---|---|---|
| grid-auto-columns | 57 | 16 | 52 | 10 | 44 |
Définition de la propriété et instructions d'utilisation
La propriété grid-auto-columns est utilisée pour définir la taille par défaut des colonnes dans un conteneur de grille.
Cette propriété affecte uniquement les colonnes sans taille définie.
| Valeur par défaut : | auto |
|---|---|
| Héritée : | non |
| animation: | Pris en charge.En savoir plus suranimable Essayez-le vous-même |
| Version : | Module de mise en page en grille CSS niveau 1 |
| Syntaxe JavaScript : | object.style.gridAutoColumns="120px" Essayez-le vous-même |
Syntaxe
grid-auto-columns: auto|max-content|min-content|length;
| Valeur | Description |
|---|---|
| auto | Valeur par défaut. La taille des colonnes est déterminée par la taille du conteneur. |
| fit-content() | Équivalent à la formule min(max-content, max(auto, argument)), classe semblable à auto de Compute (c.-à-d. minmax(auto, max-content)) |
| max-content | Définit la taille de chaque colonne en fonction du plus grand élément de grille dans la colonne. |
| min-content | Définit la taille de chaque colonne en fonction du plus petit élément de grille dans la colonne. |
| minmax(min.max) | Définit la taille comme supérieure ou égale à min et inférieure ou égale à max. |
| longueur | Définit la taille des colonnes à l'aide d'une valeur de longueur personnalisée.En savoir plus sur les unités de longueur |
| % | Utiliser des valeurs en pourcentage pour définir la taille des colonnes |
Articles connexes
Tutoriel CSS :CSS Grid Layout
Manuel de référence CSS :grid-auto-rowPropriété
autres extensions