The slides and notes from a great presentation by Eric Bailey that takes a really thoughtful deep dive into media types, media queries, and inclusive design.
The Slow Death of Internet Explorer and the Future of Progressive Enhancement · An A List Apart Article
This article is about using custom properties and CSS grid together, but I think my favourite part is this description of how custom properties differ from the kind of variables you get from a preprocessor:
let- they both serve different purposes.
A good use case for using
minmax with CSS grid to dispense with a media query.
The slides from a presentation by Drew on all the functionality that browsers give us for free when it comes to validating form inputs.
Good advice on print styles from Rachel. The browser support situation is frustrating; I suspect it’s because the people working on browsers would rather get stuck in on shinier stuff.
Chris takes us on a whirlwind tour of radial gradients in CSS.
Rich enumerates some changes in how you set up variable fonts. So if you’re pulling in a font that has weight as an axis, you can now add this to your
font-weight: 1 999;
I’m already very excited about variable fonts—I’m going to be positively giddy by the time Ampersand rolls around (which, by the way, you should totally go to—it’s going to be sooo good!).
Una has put together this handy one-pager of flexbox fallbacks for some common grid layouts.
All of this reminds me of Jake’s proposal for navigation transitions in the browser. I honestly think this would solve 80% of the use-cases for single page apps.
Jonathan goes down the rabbit hole of trying to animate a
If you’ve ever wondered what it would be like to be a fly on the wall at a CSS Working Group meeting, Richard has the inside scoop.
The consensus building is vital. Representatives from all the major browsers were in the room, collaborating closely by proposing ideas and sharing implementations. But most fundamentally they were agreeing together what should go in the specifications, because what goes in the specs is what gets built and ends up in the hands of users.
Patrick is thinking through a way to implement
:focus-visible that’s forwards and backwards compatible.
A great set of answers from Rachel to frequently asked questions about CSS grid. She addresses the evergreen question of when to use flexbox and when to use grid:
I tend to use Flexbox for components where I want the natural size of items to strongly control their layout, essentially pushing the other items around.
A sign that perhaps Flexbox isn’t the layout method I should choose is when I start adding percentage widths to flex items and setting
flex-growto 0. The reason to add percentage widths to flex items is often because I’m trying to line them up in two dimensions (lining things up in two dimensions is exactly what Grid is for).
This is a potentially useful bit of CSS that I had no idea existed.
A really deep dive into the
lang attribute, and the
:lang() pseudo-class (hitherto unknown to me). This is all proving really useful for a little side project I’m working on.
This is such a great write-up of the workshop I did in Hong Kong!
Jeremy, it was a pleasure to work with you and you are always welcome here in Hong Kong!
If you fancy having this one-day workshop at your company, get in touch.