62c3a5c918
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>
38 lines
945 B
HTML
38 lines
945 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
}
|
|
.wrapper {
|
|
/* normal flow block — not positioned */
|
|
}
|
|
.pos-auto {
|
|
position: relative;
|
|
/* z-index: auto — positioned but no stacking context */
|
|
width: 200px;
|
|
height: 50px;
|
|
}
|
|
.a { background-color: red; }
|
|
.b { background-color: green; }
|
|
.c { background-color: blue; }
|
|
.d { background-color: yellow; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- Mix of direct and deep positioned-auto elements.
|
|
All should paint in tree order at step 6. -->
|
|
<div class="pos-auto a"></div>
|
|
<div class="wrapper">
|
|
<div class="pos-auto b"></div>
|
|
</div>
|
|
<div class="pos-auto c"></div>
|
|
<div class="wrapper">
|
|
<div class="wrapper">
|
|
<div class="pos-auto d"></div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|