Re: [csswg-drafts] [css-lists-3][css-pseudo-4] Does text-transform inherit to ::marker? (#4206)

Actually it's more complex than "Gecko blocks inheritance of text-transform, whereas Chrome allows it."

Consider this [testcase](http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C!DOCTYPE%20html%3E%0A%3Cstyle%3E%0Ali%20%7B%20text-transform%3A%20uppercase%20%7D%0A.type-roman%20%7B%20list-style-type%3A%20lower-roman%20%7D%0A.type-string%20%7B%20list-style-type%3A%20%27i.%20%27%20%7D%0A.marker-roman%20%3A%3Amarker%20%7B%20content%3A%20counter(list-item%2C%20lower-roman)%20%27.%20%27%20%7D%0A.marker-string%20%3A%3Amarker%20%7B%20content%3A%20%27i.%20%27%20%7D%0A%3C%2Fstyle%3E%0A%3Col%20class%3D%22type-roman%22%3E%3Cli%3Econtent%3C%2Fli%3E%3C%2Fol%3E%0A%3Col%20class%3D%22type-string%22%3E%3Cli%3Econtent%3C%2Fli%3E%3C%2Fol%3E%0A%3Col%20class%3D%22marker-roman%22%3E%3Cli%3Econtent%3C%2Fli%3E%3C%2Fol%3E%0A%3Col%20class%3D%22marker-string%22%3E%3Cli%3Econtent%3C%2Fli%3E%3C%2Fol%3E):

```html
<ol class="type-roman"><li>content</li></ol>
<ol class="type-string"><li>content</li></ol>
<ol class="marker-roman"><li>content</li></ol>
<ol class="marker-string"><li>content</li></ol>
```

```css
li { text-transform: uppercase }
.type-roman { list-style-type: lower-roman }
.type-string { list-style-type: 'i. ' }
.marker-roman ::marker { content: counter(list-item, lower-roman) '. ' }
.marker-string ::marker { content: 'i. ' }
```

Firefox renders it as

```
i. CONTENT
i. CONTENT
 I.CONTENT
 I.CONTENT
```

So it seems ::marker's `content` obeys `text-transform` just like a ::before would do, but `list-style-type` does not. But I guess https://bugzil.la/1542807 may make `list-style-type` obey `text-transform`.

Note that Chromium doesn't support ::marker yet, but recently I implemented `list-style-type: <string>`. With LayoutNG, the result looks like

```
I. CONTENT
I. CONTENT
1. CONTENT
1. CONTENT
```

So `list-style-type` obeys `text-transform`. But in legacy, `list-style-type` behaves like in Firefox:

```
i. CONTENT
i. CONTENT
1. CONTENT
1. CONTENT
```

Given that Firefox plans to remove legacy layout code path for ::marker, and Chromium will also remove legacy layout at some point, maybe we can resolve that ::marker should inherit `text-transform`? And probably other text properties like `letter-spacing` and `word-spacing`?

-- 
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4206#issuecomment-546031937 using your GitHub account

Received on Thursday, 24 October 2019 17:56:45 UTC