985671 - top: auto on absolutely positioned element is incorrectly affected by it's flexbox's align-items value

Status: VERIFIED DUPLICATE of bug 874718

(Core :: Layout, defect)

Description

[Anthony Liatsis]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.152 Safari/537.36

Steps to reproduce:

An absolutely positioned element with top: auto inside of a flexbox can be moved by flex's align-items.

Here is a copepen demonstrating the issue:
http://codepen.io/anon/pen/biupc/

The element on the left has vertical centering for the flexbox, altering the top: auto of the absolute element. The element on the right does not have the align-items property set and behaves appropriately. Chrome does not exhibit this behavior.


Actual results:

align-items of the flexbox breaks the absolutely positioned element with top: auto out of the container.


Expected results:

Top: auto should have kept the left/top of the absolute element in place.

Comment 1

[Liz Henry (:lizzard) (relman/hg->git project)]

Thanks for reporting this, Anthony!

Comment 2

[Liz Henry (:lizzard) (relman/hg->git project)]

The test case looks the same in Nightly.

Comment 3

[Daniel Holbert [:dholbert]]

Yup, our code for absolutely positioned children of a flex container is from an older version of the spec. The spec changed on this a while back, but the changes were marked "at risk" meaning they might've been reverted. They stuck reverted, though, so we do need to fix this, and it's on my list. Bug 874718 covers that.

Comment 4

[Daniel Holbert [:dholbert]]

Verified locally that this was broken in Nightly 2016-10-31 & working in Nightly 2016-11-01, which means this is VERIFIED dupe of bug 865920.

(The functionality associated with bug 874718 first shipped in the 2016-11-01 nightly.)

Comment 5

[Daniel Holbert [:dholbert]]

(Sorry, bug-number-typo -- I meant to say "VERIFIED dupe of bug 874718")