[csswg-drafts] [css-writing-mode][css-display] Should writing-mode from display:contents element be applied to text?

upsuper has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-writing-mode][css-display] Should writing-mode from display:contents element be applied to text? ==
For example if I have the following code:
```html
<div style="writing-mode: horizontal-tb">
  <div style="display: contents; writing-mode: vertical-rl">平成</div>
</div>
```

Should the text in `vertical-rl` or `horizontal-tb`?

Currently, Gecko renders it as if the element is not `display: contents` (i.e. vertically). Blink and WebKit render it horizontally *but* with rotated characters, which seems to be wrong regardless. Edge doesn't seem to support `display: contents` yet so irrelevant.

Spec-wise, properties are only applied to elements, and for `display: contents`, css-display says
> For the purposes of box generation and layout, the element must be treated as if it had been replaced in the element tree by its contents

So for this case, the spec seems to indicate that the text should actually be rendered in horizontal writing mode, because the element responsible to render the text has such writing mode.

Implementation-wise, Gecko has an internal anonymous box similar to pseudo-element for text, which inherits properties from its parent element, and thus it can hold its own style and laid out independently. Blink and WebKit may have something similar (otherwise they wouldn't rotate the characters I suppose). But this is probably conceptually hard to reflect in the spec.

cc @jfkthame @kojiishi @litherum 

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3176 using your GitHub account

Received on Thursday, 27 September 2018 04:59:13 UTC