w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.42k stars 647 forks source link

[css-values] add font-size relative pixel unit rpx #7005

Open NagayamaToshiaki opened 2 years ago

NagayamaToshiaki commented 2 years ago

I came up with an idea of a unit that basically behaves like px when user's font-size is as same as browser's default, but it inflates and shrinks when user changed the font-size. I'd like to name this unit rpx.

the actual unit size would be calculated like this:

1rpx = 1px * (user-set font-size) / (browser's default font-size)

It allows us pixel-accurate design when needed while being responsive when user prefers different font-size. It will successfully replaces the html {font-size: 62.5%} hack, which results in changing unit size in simular fashion, as described in this SOF answer.

fantasai commented 7 months ago

Isn't this basically the same as the rem unit, except that 1rem = 16rpx?

Crissov commented 7 months ago

If so, then it’s basically a duplicate of #9345 (or the other way around).

Mouvedia commented 3 months ago

WeChat mini programs has a rpx unit which is equal to 1/750 * 100vw. ref https://developers.weixin.qq.com/miniprogram/en/dev/framework/view/wxss.html#Dimension-Unit