I’m obsessed with the newer CSS units. Some of my favourites are ex
, ch
, cqi/cqw
and right at the top of the pile lh
and rlh
— the line height and root line height units. I’ve been using them a lot and should probably write more about them, but in short, think em
s and rem
s for line height.
I honestly think the newer units in CSS are — for me anyway — way more impactful than grid or container queries (although they enable some of those units). These units allow you to write incredibly powerful CSS with very little effort. You just gotta learn which one does what and let your creative brain do the rest.
This run-down by Adam is great because it demonstrates the power of these units by solving a design principle we’ve long been trying to achieve on the web: proper vertical rhythm and baseline grids. It’s almost effortless because CSS has the capabilities to make it effortless. I love to see it.