156798 2016-04-20 11:01:06 -0700 Abspos flex item static position 2020-06-19 07:14:54 -0700 1 1 1 Unclassified WebKit Layout and Rendering WebKit Nightly Build All iOS 9.3 RESOLVED WORKSFORME InRadar P2 Normal --- 1 gwhit webkit-unassigned bfulgham dholbert dino gwhit jond simon.fraser svillar webkit-bug-importer oldest_to_newest 1185460 0 gwhit 2016-04-20 11:01:06 -0700 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 1200922 1 webkit-bug-importer 2016-06-09 12:26:25 -0700 <rdar://problem/26724633> 1247409 2 dholbert 2016-11-02 11:34:58 -0700 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 1247509 3 dholbert 2016-11-02 15:07:31 -0700 (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. 1663974 4 svillar 2020-06-18 13:29:20 -0700 Daniel I think this is working fine now. Could you verify? 1664072 5 dholbert 2020-06-18 18:29:55 -0700 Yes, I think this has been fixed. Safari 13.1 shows only a centered blue square (same as Firefox/Chrome) Safari 10.1 shows a centered teal square and a top-right-aligned blue square (which I think/assume was the buggy rendering). 1664073 6 dholbert 2020-06-18 18:30:40 -0700 (using the testcase that I'd posted, which is http://jsbin.com/yudabaxiyo/1/edit?html,css,output ) 1664343 7 svillar 2020-06-19 07:14:54 -0700 Closing this then. Thanks for reporting and verifying!