27926 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'essaye de développer une petite grid dans un format un peu plus exotique mais je ne trouve pas de solutions pour pouvoir la faire correctement.

Je joint une image avec le rendu que j'aimerai avoir.

Sachant que ma grille doit pouvoir se remplir dynamiquement avec le nombre de produits que j'ai stocké.

Merci d'avance pour vos réponses,
Cordialement.

upload/1669735607-85232-capturedancran2022-11-2916240.png
Salut. Ça s'appelle l'effet massonry. Pour l'instant la spécifications grid layout ne le supporte pas encore, bien qu'elle l'ait prévu à terme. Voici un exemple en ligne de ce que l'on peut faire actuellement (avec un rien de JS) : codepen.

Si l'on n'est pas trop regardant sur la disposition des items, on peut aussi le faire sans javascript, juste avec CSS columns : codepen
Modifié par Olivier C (21 Dec 2022 - 04:52)