1310170 - Implement 'lh' and 'rlh' units

Status: RESOLVED FIXED

(Core :: CSS Parsing and Computation, enhancement, P3)

Description

[Sebastian Zartner [:sebo]]

CSS Values and Units 3 defines[1] lh and rlh units that refer to the computed line height of the element it is applied to resp. the root element.

Sebastian

[1] https://drafts.csswg.org/css-values-3/#font-relative-lengths (actually, will define, see https://github.com/w3c/csswg-drafts/pull/602)

Comment 1

[yisibl]

Move to here: https://drafts.csswg.org/css-values-4/#lh

Comment 2

[Xidorn Quan [:xidorn] UTC+10]

Attachment: a very early stage wip patch (only the parsing part added)

Comment 3

[Gérard Talbot]

Tests

http://w3c-test.org/css/css-values/lh-rlh-on-root-001.html

http://w3c-test.org/css/css-values/lh-unit-001.html

http://w3c-test.org/css/css-values/lh-unit-002.html

Comment 4

[Gérard Talbot]

Test results

---

https://wpt.fyi/results/css/css-values?label=master

So far, no browser pass these 3 tests.

Correspondent WebKit bug report:
https://bugs.webkit.org/show_bug.cgi?id=195180

Comment 5

[709922234]

Safari Technology Preview supported

Comment 6

[Emilio Cobos Álvarez (:emilio)]

(In reply to 709922234 from comment #5)

Safari Technology Preview supported

Their implementation is broken as per https://bugs.webkit.org/show_bug.cgi?id=211351 / https://github.com/w3c/csswg-drafts/issues/3257.

Comment 7

[Daniel Holbert [:dholbert]]

FWIW, there's a textarea-auto-sizing proposal in https://github.com/w3c/csswg-drafts/issues/7542 that potentially depends on the "lh" unit being implemented.

Comment 8

[Daniel Holbert [:dholbert]]

FWIW, Blink is planning to ship support for lh units (followed later by rlh units), per https://github.com/mozilla/standards-positions/issues/699#issue-1411609731

Comment 9

[Michaël Vanderheyden]

Feature is now rolled out to chromium browsers with 109
https://caniuse.com/mdn-css_types_length_lh

Comment 10

[David Shin[:dshin]]

Attachment: Bug 1310170: Part 2 - Implement `lh` and `rlh` length units. r=#layout-reviewers

Comment 11

[David Shin[:dshin]]

Attachment: Bug 1310170: Part 1 - Separate out writing-mode check for text being vertical. r=#layout-reviewers

Comment 12

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/bd895d264c21
Part 1 - Separate out writing-mode check for text being vertical. r=emilio
https://hg.mozilla.org/integration/autoland/rev/66d921932ca7
Part 2 - Implement `lh` and `rlh` length units. r=emilio

Comment 13

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/143214321c60
Annotate another test as passing.

Comment 14

[Norisz Fay [:noriszfay]]

https://hg.mozilla.org/mozilla-central/rev/bd895d264c21
https://hg.mozilla.org/mozilla-central/rev/66d921932ca7
https://hg.mozilla.org/mozilla-central/rev/143214321c60

Comment 16

[David Shin[:dshin]]

Release Note Request
[Why is this notable]: lh and rlh units will be parsed and computed correctly as lengths, starting in Nightly 120-
[Affects Firefox for Android]: Yes
[Suggested wording]: lh and rlh units let authors specify lengths in terms of the element's (Or the root element's) line height.
[Links (documentation, blog post, etc)]: MDN

Comment 17

[Dianna Smith [:diannaS]]

Added to Fx120 release notes: https://www.mozilla.com/en-US/firefox/120.0a1/releasenotes/

Comment 18

[Acasandrei Beatrice (needinfo me)]

(In reply to Pulsebot from comment #12)

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/bd895d264c21
Part 1 - Separate out writing-mode check for text being vertical. r=emilio
https://hg.mozilla.org/integration/autoland/rev/66d921932ca7
Part 2 - Implement lh and rlh length units. r=emilio

== Change summary for alert #39828 (as of Fri, 06 Oct 2023 08:58:01 GMT) ==

Improvements:

Ratio	Test	Platform	Options	Absolute values (old vs new)
5%	startup_about_home_paint_cached	windows10-64-shippable-qr	e10s fission stylo webrender-sw	598.92 -> 568.25
4%	startup_about_home_paint_cached	windows10-64-shippable-qr	e10s fission stylo webrender	633.19 -> 608.17
4%	startup_about_home_paint_cached	windows10-64-shippable-qr	e10s fission stylo webrender	635.96 -> 610.83
4%	startup_about_home_paint_cached	windows10-64-shippable-qr	e10s fission stylo webrender	632.50 -> 608.33

For up to date results, see: https://treeherder.mozilla.org/perfherder/alerts?id=39828

Comment 19

[Vadim Makeev]

Documentation changes for this can be tracked in this GitHub issue.