mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-30 04:39:06 +00:00
910fd426a2
83b6bc4 went too far by forbidding SVGSVGElement from establishing a
stacking context. This element type does follow the behavior of CSS
boxes, unlike inner SVG elements like `<rect>`, `<circle>`, etc., which
are not supposed to be aware of concepts like stacking contexts,
overflow clipping, scroll offsets, etc.
This change allows us to delete overrides of `before_paint()` and
`after_paint()` in SVGPaintable and SVGSVGPaintable, because display
list recording code has been rearranged to take care of clipping and
scrolling before recursing into SVGSVGPaintable descendants.
`Screenshot/images/css-transform-box-ref.png` expectation is updated and
fixes a bug where a rectangle at the very bottom of the page was not
clipped correctly.
`Screenshot/images/svg-filters-lb-website-ref.png` has a more subtle
difference, but if you look closely, you’ll see it matches other
browsers more closely now.
32 lines
664 B
HTML
32 lines
664 B
HTML
<!DOCTYPE html>
|
|
<link rel="match" href="../../expected/css/svg-element-should-be-allowed-to-establish-stacking-context.html" />
|
|
<style>
|
|
#container {
|
|
position: relative;
|
|
width: 200px;
|
|
background: #ffffe0;
|
|
}
|
|
|
|
#overlay {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 200px;
|
|
height: 40px;
|
|
background: crimson;
|
|
z-index: 0;
|
|
}
|
|
|
|
svg {
|
|
width: 100px;
|
|
height: 100px;
|
|
margin-top: 30px;
|
|
position: relative;
|
|
z-index: 1;
|
|
background: lightgreen;
|
|
}
|
|
</style>
|
|
<div id="container">
|
|
<div id="overlay"></div>
|
|
<svg></svg>
|
|
</div>
|