[css-values-4] Implement font-relative cap/rcap CSS units

• Component: CSS
• Status: RESOLVED DUPLICATE

[Roman Komarov]

Link to the spec for the `cap` unit: https://www.w3.org/TR/css-values-4/#cap (was proposed in 2016, added to specs in 2017 — https://github.com/w3c/csswg-drafts/issues/660)

Firefox already supports it (end of 2021, https://bugzilla.mozilla.org/show_bug.cgi?id=1702924), and it would be really nice if Webkit would start supporting it as well.

Having more font-relative units would be really nice — for some calculations they might be crucial.

Example demo which uses `cap` unit — https://codepen.io/kizu/pen/dyeXPJP?editors=1100

Above is the version without a fallback, here is a link to a version with a fallback, using a CSS variable of 1.4ex when `cap` is not supported: https://codepen.io/kizu/pen/wvjWvZG?editors=1100 — it can be used as an approximation of how it should look, or alternatively you can check out the first link in Firefox.

[Roman Komarov]

Would also like to cross-link a ticket for Chromium — https://bugs.chromium.org/p/chromium/issues/detail?id=1201220 (opened for over a year, no progress yet)

[Radar WebKit Bug Importer]

<rdar://problem/100049503>

[Karl Dubost]

Test at https://wpt.fyi/results/css/css-values/cap-unit-001.html?label=master&label=experimental&aligned&view=subtest&q=%2Fcss-values%2Fcap-unit-001.html

maybe missing test for rcap

[Tim Nguyen (:ntim)]

*** This bug has been marked as a duplicate of bug 242466 ***