Attribut grid-auto-columns CSS

Définition et utilisation

L'attribut grid-auto-columns définit la taille des colonnes dans le conteneur de grille.

Cette propriété ne affecte que les colonnes pour lesquelles la taille n'est pas définie.

Voir également :

Tutoriel CSS :Mise en page en grille CSS

Manuel de référence CSS :Attribut grid-auto-rows

Exemple

Définir la taille par défaut des colonnes dans la grille :

.grid-container {
  display: grid;
  grid-auto-columns: 50px;
}

Essayez-le vous-même

Syntaxe CSS

grid-auto-columns: auto|max-content|min-content|length;

Valeur de l'attribut

Valeur Description
auto Valeur par défaut. La taille des colonnes est déterminée par la taille du conteneur.
fit-content()
max-content Définir la taille de chaque colonne en fonction du plus grand élément de la colonne.
min-content Définir la taille de chaque colonne en fonction du plus petit élément de la colonne.
minmax(min.max) Définir une gamme de tailles comprise entre min et max.
length Définir la taille des colonnes en utilisant des valeurs de longueur légitimes. VoirUnité de longueur。
% Définir la taille des colonnes en utilisant des pourcentages.

Détails techniques

Valeur par défaut : auto
Héritage : Non
Création d'animation : Supporté. Voir :Propriétés liées aux animations。
Version : Module de mise en page en grille CSS niveau 1
Syntaxe JavaScript : object.style.gridAutoColumns="120px"

Support du navigateur

Les nombres dans le tableau indiquent la première version de navigateur qui prend en charge cette propriété en totalité.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44