The specification[1] was updated over a year ago to change the static position of an abspos item. To test this: 1. Open http://jsbin.com/xowulasica/edit?html,css,output 2. You should only see a blue square Expected --------------- You should only see a blue square Actual --------------- You see a blue and green square [1] https://drafts.csswg.org/css-flexbox/#abspos-items
<rdar://problem/26724633>
Note: the testcase/expectations in comment 0 do not quite match the latest spec text here. Currently, the CSS Align spec basically says that the flex container's "align-items" value should be ignored for abspos children. (And Greg's original testcase here depends on it being honored for abspos children.) See notes on https://bugs.chromium.org/p/chromium/issues/detail?id=661662 for more details. Here's a modified version of the original testcase, which uses "align-self: center" on all children, rather than "align-items: center" on the parent. This should still be a valid testcase for this bug. http://jsbin.com/yudabaxiyo/1/edit?html,css,output Expected --------------- You should only see a blue square
(In reply to comment #2) > This should still be a valid testcase for this bug. > http://jsbin.com/yudabaxiyo/1/edit?html,css,output FWIW, this testcase gives "expected" results in these recent versions of all other major web engines: * Chrome 54 (latest release) * Edge 14 (latest release) * Firefox Nightly 52 (2016-11-02), where this was only fixed in the past few days.