Morten Rand-Hendriksen: CSS Grid Changes Everything (About Web Layouts)
Why Hacker News recommends it
HN commenters say it convinced them to drop other layout approaches and embrace Grid, and cite its advice on fallbacks for older browsers.
What it is
Morten Rand-Hendriksen argues that CSS Grid changes web layout, showing how to place content in cells independent of HTML source order and reshape layouts with media queries. It makes the case for using Grid now that browsers support it.
Recommended by 1 HN commenters across 1 different months, 2018 to 2018.
What Hacker News said
Strong rec rsoto · 2018-05 · on “Best Practices with CSS Grid Layout”
I'm reading the comments and I think there's a lot of misunderstanding about what CSS Grid is. Mostly because the spec is big and there's not just one way to do things, so it gets mixed with flexbox and tables. I recommend watching last year's Morten's CSS grid presentation[1] as it has convinced me to stop using other layouts/frameworks and just embrace grid, which is truly amazing and it has been a blast working with it and making responsive websites without worrying too much about the markup. 1: [this video]
Cites keth · 2018-07 · on “Show HN: Layoutit – An interactive CSS Grid generator”
I remember a video + blog post about this, and it was suggested to just ship a mobile layout for browsers that don't support css grid. At least for personal sites that seemed reasonable. EDIT: [this video]
Cites BlackMonday · 2018-12 · on “CSS grid garden”
If possible you could alternatively have send her (every browser which doesn't support full grid) a mobile layout like described in the video: [this video] > From this follows a simple but surprising truth: The lack of support for CSS grid in an old browser should not affect the experience of the visitor, but rather just make the experience different. > If you agree with this (and you should), there is no reason you can’t use CSS grid today! > Here’s how that approach could work in practice. Rather than using fallbacks and shims to ensure a design and layout look the same across all browsers, we’d provide the mobile vertical single-column layout to all browsers and then serve up advanced function