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-pseudo-4][css-lists-3] Allow 'writing-mode' on ::marker #5250

Open
fantasai opened this issue Jun 22, 2020 · 2 comments
Open

[css-pseudo-4][css-lists-3] Allow 'writing-mode' on ::marker #5250

fantasai opened this issue Jun 22, 2020 · 2 comments
Labels

Comments

@fantasai
Copy link
Collaborator

It's a common effect in vertical writing for the list marker to be rendered horizontally. In most cases the best way to do this is using text-combine-upright: all, but allowing writing-mode on the marker (which turns it into an atomic inline, effectively, and should cause it therefore to position similar to an image marker) might make sense also.

Relates to w3c/jlreq#170

@fantasai fantasai added css-lists-3 Current Work css-pseudo-4 Current Work labels Jun 22, 2020
@Loirooriol
Copy link
Contributor

Loirooriol commented Jun 23, 2020

Would text-combine-upright: all actually work well? In Firefox, if I disable layout.css.marker.restricted and use

li::marker {
  text-combine-upright: all;
  content: counter(list-item) '. '; /* Force modern marker */
}

then I get the following, note the marker dots:

In Chromium, if I enable ::marker and unrestrict it, text-combine-upright forces the marker to use legacy layout, but the list item is in LayoutNG, and this fails some asserts. [Edit: just realized that text-combine-upright already is in the list of allowed properties, I will have to fix the problem before shipping ::marker, then]

Using writing-mode: horizontal-tb seems better. But the trailing whitespace misaligns it a bit in Chromium due to white-space: pre.

@Loirooriol
Copy link
Contributor

which turns it into an atomic inline

This can be a bit annoying for inside markers in Chromium, since now they are based on LayoutInline, but if they become block containers it should be LayoutBlockFlow.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants