1607534 - `text-underline-offset` and `text-decoration-thickness` should accept percentage values

Status: RESOLVED FIXED

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

Description

[Jonathan Kew [:jfkthame]]

The CSS Text Decoration 4 spec (draft) has recently been updated to say that text-underline-offset and text-decoration-thickness can take percentages (of the em size).

This is a useful addition because (as the spec notes) a <percentage> value will inherit as relative values, unlike <length> which inherits as a fixed value (even if specified in font-relative units such as em). So a value like 10% may be more useful than 0.1em in some situations.

(I guess Safari is probably intending to implement this soon, as Myles has been an active participant in the spec discussions, though I don't yet see it in the Safari Tech Preview release notes.)

Comment 1

[Emilio Cobos Álvarez (:emilio)]

To be clear, they mean for the percentage values to resolve at layout time, right? So like line-height: <number>? I think it's bad that this behaves differently than line-height: <percentage>.

Comment 2

[Emilio Cobos Álvarez (:emilio)]

I commented on https://github.com/w3c/csswg-drafts/issues/2165#issuecomment-571727474 with that argument... I think ideally it should be text-underline-offset: <number> or something of that sort. But we could implement this as-wanted... The definition of the properties should take a <length-percentage> then, rather than a <length> | <percentage>.

Comment 3

[Jonathan Kew [:jfkthame]]

Yes, my understanding is that it's expected to behave like line-height: <number> rather than <percentage>. Do you want to object to this?

(Personally, I think it's probably the right behavior. It's unfortunate that it differs from line-height, but that's a legacy flaw that we presumably can't fix for web compatibility reasons. I'm not sure that justifies propagating the poor behavior to new properties, however.)

Comment 4

[Jonathan Kew [:jfkthame]]

I have a try build at https://treeherder.mozilla.org/#/jobs?repo=try&revision=3d108d0425aa36bfc43262ca83726b2805539cb2 that implements these as <length-percentage>, but let's see how people respond in the github issue before doing anything here.

Comment 5

[Jonathan Kew [:jfkthame]]

Attachment: Bug 1607534 - Support percentage values for the CSS text-decoration-thickness and text-underline-offset properties. r=emilio

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/280bd106d48a
Support percentage values for the CSS text-decoration-thickness and text-underline-offset properties. r=emilio

Comment 7

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/21546 for changes under testing/web-platform/tests

Comment 8

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream web-platform-tests status checks passed, PR will merge once commit reaches central.

Comment 9

[Andrei Ciure[:aciure]]

Backed out 2 changesets (bug 1607308, bug 1607534) for causing text-decoration-underline-position-vertical-ja.html to permafail
https://hg.mozilla.org/integration/autoland/rev/7b3bfdc4fd78aa3ad4bae727b0319d7378c33dbf

push that caused the backout: https://treeherder.mozilla.org/#/jobs?repo=autoland&resultStatus=testfailed%2Cbusted%2Cexception&classifiedState=unclassified&revision=64dab97e6878b19ebcd97477bd84a7d2c90ef663

failures: https://treeherder.mozilla.org/#/jobs?repo=autoland&searchStr=android%2C7.0%2Cx86-64%2Copt%2Cweb%2Cplatform%2Ctests%2Ctest-android-em-7.0-x86_64%2Fopt-geckoview-web-platform-tests-reftests-e10s-3%2Cw%28wr3%29&fromchange=261538034212154bb1d49200ef46d7075d21b589&tochange=8a4c5eff7a71989d66ec4b58e7f423de2fba247e

Comment 10

[Jonathan Kew [:jfkthame]]

Updated the patch in bug 1607308 to adjust the annotation for the newly-passing test.

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/486e43536b7c
Support percentage values for the CSS text-decoration-thickness and text-underline-offset properties. r=emilio

Comment 12

[Narcis Beleuzu [:NarcisB]]

https://hg.mozilla.org/mozilla-central/rev/486e43536b7c

Comment 13

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot