NEW 229408
Element rendered in the wrong place after sibling causes some layout changes
https://bugs.webkit.org/show_bug.cgi?id=229408
Summary Element rendered in the wrong place after sibling causes some layout changes
Tomas Carnecky
Reported 2021-08-23 04:54:54 PDT
See this Codesandbox example: https://zmslt.csb.app - Note the magenta box in the center bottom of the screen - Click on the image (to enlarge it, it simply removes the explicit width/height on the img) - Notice how the magenta box shifts to the top left. Safari Technology Preview, Release 130 (Safari 15.0, WebKit 16612.1.26.1.5) It works correctly when you: - comment out the 'inset: 0;' line in .overlay - comment out the 'display: flex;' line in .overlay - comment out the 'overflow: auto;' line in .content - comment out the 'flex: 100% 0 1;' line in .content
Attachments
Radar WebKit Bug Importer
Comment 1 2021-08-24 11:31:00 PDT
zalan
Comment 2 2021-08-24 20:42:09 PDT
This looks like a composition/painting issue on the fixed element (offsetTop/Left returns the correct value and toggling composition borders fixes the issue).
Note You need to log in before you can comment on or make changes to this bug.