1155322 - Handle & test edge cases with baselines in flex layout, with non-default writing modes

Status: RESOLVED DUPLICATE of bug 1834663

(Core :: Layout: Flexbox, defect)

Description

[Daniel Holbert [:dholbert]]

While converting flexbox layout to use logical coords, I'm hitting cases where we'll need some special-case handling for baseline computations.

(e.g. if the flex container has a LTR writing-mode but its parent has a vertical writing-mode, then IIRC we need to use its horizontal center as the "baseline", regardless of what it thinks its LTR baseline is. And baseline-alignment of flex items will be different in a vertical-writing-mode flex container, as well.)

To allow general flex-layout logicalization bugs to proceed (& mostly convert between physical & logical types), without having to handle baseline special-cases up-front, I'm filing this bug as a placeholder where I can circle back and logicalize baseline-handling & add special-cases / child-to-parent conversions as-needed.

Comment 1

[Mats Palmgren (inactive)]

Attachment: testcase

If I flip the axis using "flex-direction:column", shouldn't baseline
alignment work for vertical items then?  Or am I missing something
here... it seems Chrome doesn't do baseline alignment either in
this case so maybe I am.  The spec language here seems to suggest
it should work though:
https://drafts.csswg.org/css-align-3/#baseline-align-self

(I'm expecting the "a"'s to align their baselines.)

Comment 2

[Daniel Holbert [:dholbert]]

I believe your expectation is correct, yeah.

Right now, I think our baseline-alignment code only works for "flex-direction:row", since (per this bug) it still needs tweaking to be writing-mode aware. (And in a traditional English LTR writing mode, "flex-direction:row" is the only case where baseline alignment of items makes sense.)

Comment 4

[Ting-Yu Lin [:TYLin] (PDT, UTC-7)]

After bug 1834663, we rendered the testcase in comment 1 the same as Google Chrome.