[Webkit-unassigned] [Bug 58453] New: Absolute positioned elements in a relative positioned CSS3 Flexbox fail to display properly

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=58453

           Summary: Absolute positioned elements in a relative positioned
                    CSS3 Flexbox fail to display properly
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: All
        OS/Version: Mac OS X 10.6
            Status: UNCONFIRMED
          Severity: Major
          Priority: P2
         Component: CSS
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: matt11ag-webkitbugs at yahoo.com


Created an attachment (id=89399)
 --> (https://bugs.webkit.org/attachment.cgi?id=89399&action=review)
Test case for absolute-positioned element inside of a flexbox

Overview: If you have a CSS3 Flexbox layout the boxes display as expected (or at least mostly as expected).  However, if a box has an element inside of it that uses absolute-positioning so that its boundaries are dependent on the relative box boundaries, the absolute-positioned child element fails to display properly; its bottom edge style is ignored.

Steps to Reproduce: Minimized, easy-to-follow steps that will trigger the bug. Include any special setup steps.

1.) Either:

a.) Open the attached use-cases.html file to see if the yellow "test" absolute-positioned DIV shows up with a 20px offset from the edges of the green flexbox.

or

b.) Create a CSS3 Flexbox layout where one of the boxes uses background-color:green;position:relative and then insert a DIV inside of that box and have it use a background-color:yellow style (so you can see it) and position:absolute;top:20px;right:20px;left:20px;bottom:20px.

2.) Verify that the yellow DIV is inset by 20 pixels from the top, the left, the right, and the bottom of the green DIV.

Expected Results:  The yellow DIV should be inset by 20 pixels from every edge of the green box (compare with Internet Explorer 10 for a visual comparison).

Actual Results: WebKit does inset the yellow DIV by 20 pixels on the top, the left, and the right but fails to inset the bottom by 20 pixels.

Additional Information:  The attached use-cases.html file has many other use case scenarios you can test but all use cases fail in WebKit to handle absolute-positioned children properly.

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.