Bug 242399

Summary:	Content is z-ordered incorrectly
Product:	WebKit	Reporter:	Jeff Muizelaar <jmuizelaar>
Component:	Compositing	Assignee:	Nobody <webkit-unassigned>
Status:	NEW ---
Severity:	Normal	CC:	karlcow, simon.fraser, webkit-bug-importer
Priority:	P2	Keywords:	BrowserCompat, InRadar
Version:	Safari 15
Hardware:	Unspecified
OS:	Unspecified

Description Jeff Muizelaar 2022-07-06 10:57:04 PDT

<div style="width:400px; height: 400px; overflow:scroll">
  <div style="height:300px; background-color:blue"></div>
  <div style="height:300px; background-color:green"></div>
</div>
<div style="width:200px; height:200px; background-color:red; margin-top:-100px"></div>

The red box should be on top of the scrollable area. It is in Chrome and Firefox but not in WebKit.

Comment 1 Simon Fraser (smfr) 2022-07-06 11:13:36 PDT

This is the "fundamental compositing bug" where the scroller becomes self-painting, so z-orders on top of the following element with negative margin.

Comment 2 Jeff Muizelaar 2022-07-06 11:38:50 PDT

Are there plans to fix it?

Comment 3 Simon Fraser (smfr) 2022-07-06 11:47:12 PDT

Our current compositing architecture makes this hard to fix in the short term. In the long term, yes.

Comment 4 Radar WebKit Bug Importer 2022-07-11 01:52:58 PDT

<rdar://problem/96815353>