search

w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.51k stars 669 forks source link

[css-align-3] How to determining baseline type (alphabetic or central) when synthesizing baselines? #7578

Open bfgeek opened 2 years ago

bfgeek commented 2 years ago

https://drafts.csswg.org/css-align-3/#synthesize-baseline

The spec is pretty clear about the writing mode to use etc, however not clear about how to interpret the text-orientation property. E.g.

<!DOCTYPE html>
<div style="display: grid; justify-items: baseline; text-orientation: sideways;">
  <div style="writing-mode: vertical-rl;">hi<br>there</div>
   <!-- does below this synthesize using alphabetic or central? -->
  <div style="width: 50px; height: 50px; writing-mode: vertical-rl; background: lime; text-orientation: mixed;"></div>
</div>

(note ignore current rendering of all browsers here - they are wrong).

When synthesizing a baseline within a grid/flex context, do we synthesize based off the containers text-orientation, or the items?

(I think it should be the container - as this matches inline layout).

@fantasai @tabatkins

fantasai commented 2 years ago

We synthesize all of the baselines (central, alphabetic, etc.). The container decides which to use based on the item’s alignment-baseline property (which by default, defers to the container’s dominant-baseline property).

As for the orientation, if the text-orientation of the item is the opposite of the context, we mirror it anyway, so no matter which orientation we synthesize, the set that we end up using will match the context.

Let us know if something remains unclear?