| The age of the article says a lot; but I think there are overuses of rem, even today, where it’s used for dimensions (width, height, padding, margins) which is not a good idea. Especially when mixed with containing elements that use a mix of em & px units. Where for a while sites were using em & rem, using viewport-percentage lengths is more apprpriate for _both_ font-sizes and dimensions. And for what it’s worth Variable Fonts are a game changer that didn’t exist 7 years ago (along with a whole bunch of new standards and capabilities that make typography and layout so different today), which makes me wish there was a timeline view of all the W3C standards. What’s interesting is that the blog for that article uses a theme with a lot of that new stuff: css vars, flex box, margins & paddings with vh, calc, css grid, font properties that probably aren’t widely supported — so @supports is cool to see, and wait for … it: max-width: calc(30rem * 2); rem units It looks like this is the Author’s own theme: https://vasilis.nl/nerd/wp-content/themes/nerd-mississippi/s... It seems like it had to have been updated since the article, so indeed maybe he’s softened on rem, if not ... Why use rem if you don’t like it & why use it for 2 max-width declarations? There are a lot of % based dimensions so why not stick with that? I’m not trying to judge, but the if the author created the theme for code consistency and writing consistency that should get cleaned up. There’s also some neat bleeding edg stuff like this: h1 {
font-family: "Mississippi Regular", impact, serif;
font-weight: normal;
font-size: 15vw;
font-size: calc(2em + 14vw);
line-height: .7;
margin: 0;
position: relative;
font-size-adjust: .42;
} Where those two font-size declarations provide a responsive size where calc is supported … But if you’re using @supports in some places that’s great to use everywhere, for example he uses it here: @supports (font-variant-ligatures: common-ligatures) {
body {
font-feature-settings: normal;
font-variant-ligatures: common-ligatures;
}
} At some point font-variant-ligatures might be widely supported & using something like postcss could let you purge or optimize that automatically & if manually maintained rules like that just stick out do the road. Rem is awesome, CSS can be painstakingly difficult to keep up with. |