# 053: Responsieve kolommen voor de galerij - CSS-trucs

Inhoudsopgave

We voegen wat reactievermogen toe aan het raster dat we hebben ingesteld voor de galerij. Op de breedste schermen hebben we het ingesteld op vier kolommen. Daarna beginnen we breekpunten toe te voegen via onze supereenvoudige @mixins die we hebben ingesteld en die we overal opnieuw hebben gebruikt.

Bij ons mama-beer breekpunt dalen we af naar 3 kolommen, dan maken we een tussentijds breekpunt tussen mama-beer en baby-beer waar het in 2 kolommen breekt, dan uiteindelijk 1 kolom bij baby-beer. Dit is supergemakkelijk, want we hoeven alleen maar aan te passen hoeveel kolommen we instellen via CSS3 column-count.

We eindigen de video en praten over toekomstige doelen voor de galerie. Het zou leuk zijn om een ​​verschillend aantal afbeeldingen op verschillende schermformaten te kunnen laden en echte miniaturen te gebruiken in plaats van afbeeldingen op volledige grootte. Misschien komen we er ooit.

Voor de goede orde, de software die ik lokaal gebruik om schermafbeeldingen te maken en deze via FTP naar de server te uploaden, is LittleSnapper.

Interessante artikelen...