Bug 229408
| Summary: | Element rendered in the wrong place after sibling causes some layout changes | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Tomas Carnecky <tomc> |
| Component: | Compositing | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | koivisto, simon.fraser, webkit-bug-importer, zalan |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari Technology Preview | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
Tomas Carnecky
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 | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/82301706>
zalan
This looks like a composition/painting issue on the fixed element (offsetTop/Left returns the correct value and toggling composition borders fixes the issue).