28219 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai une grille en auto-fill avec un nombre d'éléments inconnu.

Je dois placer un élément sur la dernière ligne et lui faire occuper tout l'espace de la colonne, cela quelle que soit la taille de la fenêtre redimensionnée ou non.

figure {display: grid; grid-template-columns: repeat(auto-fill,110px); grid-template-rows: auto; gap: 1px; place-content: start}

figure > img:not([tabindex]):last-child {display: block; grid-column: 1/-1; grid-row: -1/-1 ; padding: 20px 0; outline: none}


Je pense que grid-row: -1/-1 demande le placement sur la dernière rangée mais cela ne fonctionne pas.

6 éléments, la place d'en afficher 3, mon élément :last-child s'affiche sur la deuxième ligne, pas la troisième.

Par contre grid-column: 1/-1 fonctionne bien, l'élément occupe toute la largeur possible.

Avez-vous une solution ?

Merci d'avance.