# 050: Opbygning af Galleri Gitter - CSS-tricks

Indholdsfortegnelse

Vi begynder at grave i layoutet af galleriområdet, hvilket er noget, jeg har tænkt på siden starten af ​​denne redesignproces. For det meste fordi ... galleriet i v9 er ganske suget. Vi kommer til at gøre det bedre denne gang.

Vi laver galleriets layout intet andet end et stort gitter med billeder. Det er, hvad andre gallerier har, der er en fornøjelse at gennemse, så dette skal også være sådan. Med andre ord: ingen sidebjælke, flere billeder.

Vi baserer layoutet på den problemfrie responsive fotogitterartikel, jeg gjorde for et stykke tid tilbage. I det væsentlige lader vi billederne alle falde som inline-blokke i en forælder, der bruger CSS3-kolonner. Heldigvis har Compass nogle hjælpere, der gør det endnu lettere. Renderne er lavet gennem søjleafstand og bundmargen.

For at simulere noget ægte indhold bruger vi randomiserede stedkillinger i en løkke.

Interessante artikler...