Why does nobody talk about using CSS Grid for photo galleries?

I was at a local coffee shop last week and saw the barista's personal photo blog on his laptop. The gallery layout was this perfect staggered grid that looked amazing. I asked him how he did it and he said it was just CSS Grid with named template areas. He showed me how he defined rows and columns for each photo size. I went home and tried it myself on my own gallery page. Now I am wondering why more tutorials push flexbox for this when Grid handles the whole layout in like 20 lines of code. Has anyone else found weird situations where Grid just works way better than expected?

2 comments

2 Comments

nathanking20d agoMost Upvoted

Yeah Grid is totally slept on for galleries, it just clicks.

nancy319d ago

GIRL, YES! I had the exact same thing happen when I redid my own photo page last year. I fought with flexbox for hours trying to get that nice uneven look, then someone showed me a grid setup with just a few lines and I felt SO dumb. It handles different photo sizes, the gaps, the whole thing just snaps into place. Once you get the named areas thing, it's honestly hard to go back to flex for anything with photos.