Met this dev at a meetup in Portland who showed me a 7-line CSS grid trick

I was stuck on a card layout with uneven heights. He pulled up his laptop at the bar. Wrote 7 lines of CSS. Used grid-auto-rows and align-items. No more flexbox hacks. Took me 2 months to stumble on that on my own. He just did it in 2 minutes. Anyone else have a random stranger fix your layout with one small trick?

2 comments

2 Comments

sandra14610d ago

Ha, yeah it's a neat trick but people act like it's the second coming of sliced bread. @sullivan.john probably read that on CSS-Tricks or whatever, I bet the blog even had a 3D rotating cube demo that worked half the time. I mean, it's useful if you're dealing with a grid of cards from a CMS dump, but for most normal layouts flexbox still does the job fine without the extra mental overhead.

sullivan.john11d ago

Read on some blog that grid-auto-rows is basically magic for uneven card heights.