Is there a way to set variable font-weight in viewport units? Like `font-weight: 60vw;` Or `font-weight: calc(60vw);` ? Why not? /cc @fantasai @davidbaron @Litherum @gregwhitworth @jpamental @djrrb @clagnut #ampersandconf
5
17
It’s because it needs a unit less value for weight, so that calc results in a vw or px unit being added. But there is work going on in the CSSWG on an update to calc to enable that!
1
1
Does it work for anything? Stretch needs a percent. Optsizing? Hmm.
2
I think that if you multiply the cake by 1% as a last operation it will end up as a percent, but I haven’t had a chance to test that...
1
1
Nope. Firefox & Safari: `font-stretch: calc(50*1%)` works. `font-stretch: calc(50vw*1%)` fails. Neither works in Chrome, even `font-stretch: 50%` fails. Edge, mystery box since there’s no Edge for Mac. Hm.
2
1
Right. The calculation you want is “50vw / 1vw * 1%” to get the units right. No implementation supports dividing by units (there was some trickiness with 0, IIRC, I don’t remember exactly). CSS did resolve fairly recently, though, to add it to the spec, albeit in the next level.
3
5
The resolution to do this was from 2014 (or maybe earlier; we resolved to do it multiple times before the spec was edited), but the spec changes were actually made recently in github.com/w3c/csswg-drafts/… .

Jul 1, 2018 · 7:56 PM UTC

2