[Résolu] Grid-row : 1 / span toute la hauteur sans savoir combien de r

Bonjour,

J'ignore le nombre de rangées dans un CRID, disons qu'il est variable.

Et j'aimerais qu'un élément en colonne 1 n'ai aucun impact sur le placement vertical des éléments de la colonne 2.

Donc qu'il occupe toute la colonne.

Y a-t-il un moyen de coder span "toutes les rangées" ?

J'ai essayé grid-row : 1 / -1 mais cela ne fonctionne pas.
Modifié par boteha_2 (25 Feb 2026 - 21:54)

boteha_2 a écrit :
Bonjour,

J'ignore le nombre de rangées dans un CRID, disons qu'il est variable.

Et j'aimerais qu'un élément en colonne
1. n'ai aucun impact sur le placement vertical des éléments de la colonne
2. Donc qu'il occupe toute la colonne.

Y a-t-il un moyen de coder span "toutes les rangées" ?

J'ai essayé grid-row : 1 / -1 mais cela ne fonctionne pas.

Bonjour,

Non ,
grosso modo: Il n'y a qu'une largeur qu'un navigateur peut connaître car il doit la calculer pour l'affichage (ex: largeur de fenêtre) .
Pour ce qui est des hauteurs elle ne sont pas calculées, elles n'ont en principe pas de limites . Donc par exemple, width:100% et grid-col:1/-1; sont utilisables sans qu'il y ait besoin de fixer une valeur sur le parent mais pas height:100% ou grid-row:1/-1.

Possibilités:
1. tricher en donnant une valeur grid-row: 1/ X importante sans définir de hauteur à grid-template-rows et en mettant row-gap à 0

2. utiliser 2 grilles imbriquées

<div>
    <div>col 1</div>
    <div><!-- col 2 ,  grille -->
     <!-- X grid items -->
     </div>
</div>

3. javascript ...

Cordialement

Bonjour gcyrillus,

Merci pour le suivi et les explications.

La solution 1 fonctionne, je l'ai expérimentée.

Une solution 4 est de compter le nombre de rangées côté PHP et de générer une déclaration CSS dynamique avec le bon span.

Un détail qui m'a surpris, avec un tableau sur 3 rangées, pour couvrir les 3 rangées, si Table rowspan="3" mais si Grid span 4.

Comme d'habitude j'attends un peu avant de cocher Résolu.
Modifié par boteha_2 (01 Mar 2026 - 12:14)

Bonjour,

Point clé :

gcyrillus a écrit :
Pour ce qui est des hauteurs elle ne sont pas calculées, elles n'ont en principe pas de limites . Donc par exemple, width:100% et grid-col:1/-1; sont utilisables sans qu'il y ait besoin de fixer une valeur sur le parent mais pas height:100% ou grid-row:1/-1.

Je coche Résolu, encore merci.