Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
r12a opened this issue Apr 10, 2017 · 11 comments
Open

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

r12a opened this issue Apr 10, 2017 · 11 comments
Labels
css-text-decor-3 Current Work i18n-jlreq Japanese language enablement i18n-tracker Group bringing to attention of Internationalization, or tracked by i18n but not needing response. Needs Edits

Comments

@r12a
Copy link
Contributor

r12a commented Apr 10, 2017

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).

@r12a r12a added the i18n-tracker Group bringing to attention of Internationalization, or tracked by i18n but not needing response. label Apr 10, 2017
@fantasai
Copy link
Collaborator

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

@fantasai fantasai added the Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. label Sep 12, 2022
@r12a
Copy link
Contributor Author

r12a commented Sep 26, 2022

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

@hober
Copy link
Member

hober commented Jun 24, 2024

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.

@hober hober added css-text-decor-3 Current Work i18n-jlreq Japanese language enablement labels Jun 24, 2024
@fantasai fantasai added Agenda+ and removed i18n-jlreq Japanese language enablement Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. labels Jun 24, 2024
@fantasai
Copy link
Collaborator

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 hober added i18n-jlreq Japanese language enablement and removed Agenda+ labels Jun 24, 2024
@hober
Copy link
Member

hober commented Jun 24, 2024

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
Copy link
Member

nt1m commented Aug 6, 2024

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
Copy link
Member

nt1m commented Sep 10, 2024

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

@jfkthame
Copy link
Contributor

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
Copy link
Member

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

@dletorey
Copy link

I have a question about text-emphasis-position: auto; I assume that auto is the initial value, is my assumption here correct?

@jfkthame
Copy link
Contributor

I have a question about text-emphasis-position: auto; I assume that auto is the initial value, is my assumption here correct?

I believe that was the intention, yes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
css-text-decor-3 Current Work i18n-jlreq Japanese language enablement i18n-tracker Group bringing to attention of Internationalization, or tracked by i18n but not needing response. Needs Edits
Projects
None yet
Development

No branches or pull requests

7 participants