# 050: Construire la grille de la galerie - Astuces CSS

Table des matières

Nous commençons à creuser dans la disposition de la zone Galerie, ce qui me préoccupe depuis le début de ce processus de refonte. Surtout parce que… la galerie en v9 était un peu nul. Nous allons faire mieux cette fois.

Nous allons faire de la mise en page de la galerie rien d'autre qu'une grande grille d'images. C'est ce que d'autres galeries ont un plaisir de parcourir, donc cela devrait également être le cas. En d'autres termes: pas de barre latérale, plus d'images.

Nous basons la mise en page sur l'article de grille de photos réactif transparent que j'ai fait il y a quelque temps. Essentiellement, nous laissons toutes les images tomber sous forme de blocs en ligne dans un parent qui utilise des colonnes CSS3. Heureusement, Compass a quelques aides pour rendre les choses encore plus faciles. Les gouttières sont faites par l'espacement des colonnes et la marge inférieure.

Pour simuler du contenu réel, nous utilisons des Placer des chatons aléatoires dans une boucle.

Articles intéressants...