[Webkit-unassigned] [Bug 175560] New: position: absolute flex children are incorrectly positioned
bugzilla-daemon at webkit.org
bugzilla-daemon at webkit.org
Mon Aug 14 19:44:01 PDT 2017
https://bugs.webkit.org/show_bug.cgi?id=175560
Bug ID: 175560
Summary: position: absolute flex children are incorrectly
positioned
Product: WebKit
Version: Safari 10
Hardware: Unspecified
OS: Unspecified
Status: NEW
Severity: Normal
Priority: P2
Component: Layout and Rendering
Assignee: webkit-unassigned at lists.webkit.org
Reporter: diogomfranco at gmail.com
CC: bfulgham at webkit.org, simon.fraser at apple.com,
zalan at apple.com
`position: absolute` children are always positioned on the parent's top/left corner, instead of being positioned according to the flex algorithm.
https://www.w3.org/TR/css-flexbox-1/#abspos-items says that the item should be positioned "as if it was the sole child" of the flex container,
but it ignores the align-items/justify-content settings of the flex container in WebKit. It is correctly positioned in Blink, for example.
The following jsfiddle has a runnable reproduction https://jsfiddle.net/f63zeeta/
For the record, here is the HTML source:
<div class='wrapper'>
<div class='first-child'></div>
<div class='second-child'></div>
</div>
Here is the CSS source:
.wrapper {
display: flex;
align-items: center;
justify-content: center;
}
.first-child {
position: absolute;
width: 20px;
height: 20px;
background: black;
}
.second-child {
width: 50px;
height: 50px;
background: white;
}
--
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20170815/26a859e8/attachment.html>
More information about the webkit-unassigned
mailing list