# 050: Costruire la griglia della galleria - Trucchi CSS

Sommario

Iniziamo a scavare nel layout dell'area Gallery, che è qualcosa che ho in mente dall'inizio di questo processo di riprogettazione. Soprattutto perché ... la galleria in v9 faceva schifo. Questa volta faremo meglio.

Faremo in modo che il layout della galleria non sia altro che una grande griglia di immagini. Questo è ciò che le altre gallerie hanno che è un piacere navigare, quindi anche questo dovrebbe essere così. In altre parole: nessuna barra laterale, più immagini.

Basiamo il layout sull'articolo della griglia fotografica reattiva senza interruzioni che ho fatto qualche tempo fa. Essenzialmente lasciamo che le immagini cadano tutte come blocchi in linea in un genitore che utilizza colonne CSS3. Fortunatamente, Compass ha alcuni aiutanti per renderlo ancora più semplice. Le grondaie sono realizzate attraverso la spaziatura delle colonne e il margine inferiore.

Per simulare alcuni contenuti reali, utilizziamo Place Kittens randomizzati in un loop.

Articoli interessanti...