[css-text-decor] text-underline-position auto in vertical text

[r12a]

2.6. Text Underline Position: the text-underline-position property > Auto https://drafts.csswg.org/css-text-decor-3/#underline-auto

If you apply text-underline-position: auto, should the underline appear on the right of Japanese (and Mongolian) text, as is recommended for the default text-decoration(-line):underline values?

If so, it would be good to make that clear (and btw how 'alphabetic baseline' relates to cjk positioning of an underline in vertical text).

[fantasai]

No, auto does not switch sides. It only allows the position to be automatically adjusted on that side

[r12a]

Could we add a note or some text to clarify that?

[hober]

Both Chrome and Firefox put the underline on the right by default in vertical Japanese when text-underline-position is auto. We should probably update the spec to allow that.

[fantasai]

See testcase.

This is currently not allowed per spec; instead the spec has UA rules that set the behavior per language.

Do we want to

• Update the definition of auto to match Firefox?
• Or update implementations to match the spec?

[hober]

Firefox (and Chrome)'s current behavior is better than the specced behavior, so I think we should update the definition of auto. Given their current behavior, it's presumably web-compatible to make such a spec change.

[nt1m]

I think the auto value should stay as is, and we should instead rely on the UA stylesheet to do the right thing: https://drafts.csswg.org/css-text-decor-3/#default-stylesheet

This is what WebKit implements, and I think it's sensible.

My suggestion would be to resolve with no change.

[nt1m]

Whatever ends up being done here should be consistent with text-emphasis-position

[jfkthame]

Firefox (and Chrome)'s current behavior is better than the specced behavior, so I think we should update the definition of auto. Given their current behavior, it's presumably web-compatible to make such a spec change.

FWIW, it looks like Firefox, at least, has been doing this for 9 years (since https://bugzilla.mozilla.org/show_bug.cgi?id=1175789, long before text-underline-position was supported), and as far as I recall we haven't seen any issues with this being the default (now auto) behavior.

[css-meeting-bot]

The CSS Working Group just discussed [css-text-decor] text-underline-position auto in vertical text, and agreed to the following:

• RESOLVED: add auto value for text-emphasis-position, and change the meaning of text-underline-position: auto to care about left vs right in vertical text

The full IRC log of that discussion

<chrishtr> fantasai: the initial value of text-underline-position is auto, which is defined as "find a good place to put the underline". Three options there: (1) under alphabetical baseline, (2) fully below text (good for lots-of-descenders cases), (3) for vertical text on the RHS
<chrishtr> fantasai: auto value is defined in the spec about 'how far down below the text', but doesn't say things about flippinng
<chrishtr> fantasai: the current spec says "at or below"
<chrishtr> fantasai: in order to handle language-specific aspects, there is a default UA style sheet that for Chinese and Japanese and Korean there are differences for those languages
<fantasai> https://drafts.csswg.org/css-text-decor-3/#default-stylesheet
<chrishtr> fantasai: a couple of implementations do this
<chrishtr> fantasai: should we change the spec to mention these things?
<chrishtr> fantasai: or should we stick with the UA stylesheet approach?
<fantasai> https://www.w3.org/TR/css-text-decor-4/#text-emphasis-position-property
<chrishtr> fantasai: propose that we keep the spec as-is
<fantasai> https://www.w3.org/TR/css-text-decor-4/#text-underline-position-property
<Rossen3> q?
<chrishtr> fantasai: this would require some implementations to change though
<chrishtr> chrishtr: which implementations would need to change?
<chrishtr> fantasai: chrome and firefox are language-sensitive for auto, and webkit uses the default UA style sheet
<chrishtr> rossen: does this mean that webkit needs to change?
<chrishtr> florian: other way around, it would mean chrome and firefox need to change?
<chrishtr> florian: since the two approaches both exist it seems going either way would be web compatible
<emilio> q+
<chrishtr> rossen: sounds like a low-ROI change
<chrishtr> rossen: is it a problem in practice?
<Rossen3> ack emilio
<chrishtr> emilio: I think we should try to go for the firefox/chrome approach
<chrishtr> emilio: avoids weird styles change in ways that developers might not expect
<chrishtr> emilio: we had the same problem with quotes if I'm remembering correctly
<chrishtr> fantasai: that was the first time we had a language-aware value
<chrishtr> emilio: reusing that mechanism for this makes sense, but don't have a strong opinion
<chrishtr> fantasai: if there is a strong need for these things they we could introduce auto keywords for other things, otherwise UA stylesheet for this case?
<chrishtr> jfkthame: text decoration skip ink does something also, seems to me auto is the cleanest approach
<fantasai> s/other things/text-emphasis-position/
<florian> s/and firefox need to change?/and firefox need to change if we keep the spec unchanged?
<chrishtr> ntim: aligning with text-emphasis-position makes sense to me, and it doesn't have an auto value. i.e. that feature uses UA style sheet rules
<chrishtr> chrishtr: is that true for all browsers?
<chrishtr> fantasai: yes, because there is no auto keyword
<dholbert> s/does something/does something language-specific/ (in jfkthame's minutes above)
<chrishtr> jfkthame: it would make sense to me to add auto to that property also
<chrishtr> florian: that would be a change in all browsers
<chrishtr> jfkthame: yes but that could be an improvement
<chrishtr> ntim: is it a common use case to use the auto value to override a non-default value?
<chrishtr> ntim: if not, then the UA style sheet does the job just fine
<chrishtr> florian: we can achieve the effect we want with the UA style sheet, or with auto. both approaches yield the desired result from an author point of view
<chrishtr> florian: from an author point of view, both work. Agree that it's odd for two very similar properties to have different approaches, agree it would be best to be consistent.
<fantasai> A) Keep spec as-is, update Gecko + Blink to match (using UA stylesheet for language switch)
<chrishtr> fantasai: option a: keep spec as-is, update gecko & chromium to match. option b: change spec, change webkit to match.
<fantasai> B) Introduce to text-emphasis-position and use it in both text-emphasis-position and text-underline-position to effect language switches
<ntim> Option b requires changing text-emphasis-position in all browsers too
<fantasai> s/Introduce/Introduce auto/
<fantasai> C) Adopt inconsistent behavior: text-underline-position uses 'auto' and text-emphasis-position uses UA stylesheet
<TabAtkins> abstain, no opinion
<emilio> B
<fantasai> POLL: A, B, or C?
<vmpstr> abstain
<chrishtr> B
<jfkthame> B, A, C
<astearns> abstain
<ntim> A, B, C
<fantasai> A, B, C
<ydaniv> abstain
<miriam> abstain
<florian> indifferent between A and B, dislike of C
<dholbert> B, A, C
<schenney> B, A, C
<dbaron> neutral on A vs B, prefer them to C
<oriol> abstain
<rachelandrew> abstain, no strong opinion
<DavidA> abstain
<kizu> abstain
<kbabbitt> abstain
<flackr> abstain
<chrishtr> proposed resolution: add auto value for text-emphasis-position, and change the meaning of text-underline-position: auto to care about left vs right in vertical text
<florian> wfm
<chrishtr> fantasai: one side effect of the proposed resolution is that the computed style is less transparent to the developer, vs inspecting the UA style sheet
<emilio> q+
<flackr> q+
<chrishtr> emilio: you have the opposite argument with making initial do the right thing, right?
<chrishtr> emilio: there are arguments in both directions in this dimension
<Rossen3> ack emilio
<chrishtr> emilio: being able to set something reasonable via resets in the style sheet, I mean
<chrishtr> emilio: would expect the initial value to do the right thing - resetting gets rid of UA style sshets
<chrishtr> s/sshets/sheets/
<chrishtr> jftkhame: does seem an auto keyword should do the right thing
<Rossen3> ack flackr
<chrishtr> flackr: what would a UA style sheet rule setting this look like?
<fantasai> https://www.w3.org/TR/css-text-decor-4/#default-stylesheet
<chrishtr> fantasai: current default style sheet rules ^^
<florian> :root:lang(zh), [lang|=zh] { text-emphasis-position: under right; }
<florian> [lang|=ja], [lang|=ko] { text-emphasis-position: over right; }
<chrishtr> flackr: writing direction doesn't affect this?
<chrishtr> fantasai: there are two keywords to set the position
<chrishtr> flackr: Thanks. I'm still in favor of option B
<ntim> I'm not objecting, but I can't give a guarantee we can implement option A anytime soon
<chrishtr> RESOLVED: add auto value for text-emphasis-position, and change the meaning of text-underline-position: auto to care about left vs right in vertical text