[Webkit-unassigned] [Bug 226483] New: position:absolute behaves like position:relative in flexbox with space-between

[bugzilla-daemon at webkit.org]

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

            Bug ID: 226483
           Summary: position:absolute behaves like position:relative in
                    flexbox with space-between
           Product: WebKit
           Version: Safari 14
          Hardware: Mac (Intel)
                OS: macOS 11
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: lesha at lesha.co
                CC: bfulgham at webkit.org, simon.fraser at apple.com,
                    zalan at apple.com

Created attachment 430242

  --> https://bugs.webkit.org/attachment.cgi?id=430242&action=review

demo code

Running Safari Version 14.0.3 (16610.4.3.1.7)
https://jsfiddle.net/suda14q3/

I have a flexbox with justify-content:space-between.
One of its descendants (.parent_right) has two children: .ch1 (gold), .ch2 (lime), both 100px wide.

When I resize the webpage down past 500px, I trigger a media query, which sets position:absolute to .ch1. 

Safari doesn't seem to update .parent_right's width and it looks like its still takes 200px of space.

If I now reload the webpage, everything will look fine (.parent_right 100px wide because .ch2 is 100px wide and .ch1 is positioned absolute)

I will resize the window back up to 500px+ and another bug occurs: children of .parent_right take up 50px each.

---
Expected behavior: 
When resizing down: .ch1 is moved to the top of .ch2, no space is left to the right of them. .parent_right takes 100px;
When resizing back up: everything returns back to initial state

I'm sorry if this explanation is clumsy, not a native speaker. I can record a video of the bug if needed.

-- 
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/20210601/8c56f709/attachment.htm>