[Résolu] Grid: bloquer la largeur d'une colonne ?

Bon, c'est un peu plus complexe en fait.
J'ai une grille définie avec

grid-template-columns: var(--largeur) auto;

L'espace initial se comporte exactement comme je le souhaite.
Dans la seconde colonne, je dois ajouter du contenu en provenance d'une autre source.
Ce contenu fait s'élargir la colonne (comportement normal de grid)
comment empêcher cet élargissement?
les

 max-width:100%

sont sans effet, tant sur la grille, la colonne que le contenu.
Une valeur en pixel fonctionne, mais je voudrais l'éviter, la largeur n'étant pas connue au départ et l'ensemble devant rester adaptatif.
Possible assez facilement en Javascript/jquery, mais j'aimerai aussi l'éviter en restant sur du pur CSS.

Je vois deux types de solution, mais je sèche sur les deux :
1- Empêcher la grille de sortir de son conteneur
2- Bloquer la taille du contenu distant
Je ne vois pas comment faire l'un ou l'autre sans utiliser une valeur fixe pour width, ce que je voudrais éviter...

Bonjour,
Selon ce que je comprend je tenterai plutôt un :

grid-template-columns: 1fr minmax(250px, 0.3fr);

ou , si tu tiens à ta var() ,

grid-template-columns: minmax( var(--largeur), 1fr) minmax(250px, 0.3fr);

A tester et adapter à tes valeurs .

edit: si var(--largeur) à besoin d'être contenu entre deux valeurs , tu peut aussi eventuellement l'inclure dans un clamp(min-width, var(--largeur), max-width) .
cdt
Modifié par gcyrillus (05 Apr 2026 - 12:15)

Trouvé... désolé pour le bruit.
C'est en fait assez simple.

.macolonnedegrille: {overflow:auto;}
.moncontenudistant: {width:100%;}

Modifié par phil_zic (05 Apr 2026 - 12:16)