The display list builder only categorized direct children into CSS paint-order buckets. Stacking-context elements nested inside normal-flow intermediaries (like <body>) rendered in document order instead of at the correct steps 2/7 per CSS 2.1 Appendix E. This caused elements with explicit z-index to paint incorrectly relative to siblings. Add a recursive tree walk (collect_stacking_participants) that collects stacking-context descendants from the entire subtree, tracking ancestor overflow:hidden clip rects. Hoisted elements render with preserved clips via render_with_ancestor_clips. Skip guards in render_layout_box_normal and render_non_inline_descendants prevent double-rendering. Scope is limited to stacking contexts (positioned + z-index) to avoid regressions with float paint ordering. Positioned-auto deep hoisting and stacking contexts inside floats are documented follow-ups. Promotes 4 WPT tests, demotes 1 (pre-existing step 3/5 limitation). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
34 lines
880 B
HTML
34 lines
880 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
}
|
|
.fixed-bg {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 200px;
|
|
height: 100px;
|
|
background-color: red;
|
|
/* z-index: auto (no stacking context) */
|
|
}
|
|
.relative-fg {
|
|
position: relative;
|
|
z-index: 2;
|
|
width: 200px;
|
|
height: 100px;
|
|
background-color: green;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- fixed-bg is a direct child of body, positioned with z-index auto -->
|
|
<div class="fixed-bg"></div>
|
|
<!-- relative-fg is also a direct child of body, creates stacking context with z-index:2 -->
|
|
<!-- It should paint ON TOP of fixed-bg because z-index:2 > z-index:auto -->
|
|
<div class="relative-fg"></div>
|
|
</body>
|
|
</html>
|