Blitz - WPT: box-shadow-svg-root-fixed-position.html

wpt / css / css-backgrounds / box-shadow-svg-root-fixed-position.html

/css/css-backgrounds/box-shadow-svg-root-fixed-position.html

<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Backgrounds Test: box-shadow paints on a position:fixed SVG root</title>
<link rel="help" href="https://www.w3.org/TR/css-backgrounds-3/#the-box-shadow">
<link rel="match" href="box-shadow-svg-root-fixed-position-ref.html">
<meta name="fuzzy" content="maxDifference=0-40;totalPixels=0-2000">
<style>
    .shadow-box {
        width: 100px;
        height: 100px;
        box-shadow: 1px 1px 5px 3px #aaaaaa;
    }
    .fixed-position {
        position: fixed;
        top: 8px;
        left: 8px;
    }
</style>
<!-- A position:fixed SVG root must still paint its CSS box-shadow. -->
<svg class="shadow-box fixed-position">
    <rect x="0" y="0" width="100%" height="100%" fill="red"/>
</svg>

/css/css-backgrounds/box-shadow-svg-root-fixed-position-ref.html

<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference: box-shadow paints on a position:fixed box</title>
<style>
    .shadow-box {
        width: 100px;
        height: 100px;
        box-shadow: 1px 1px 5px 3px #aaaaaa;
    }
    .fixed-position {
        position: fixed;
        top: 8px;
        left: 8px;
    }
</style>
<div class="shadow-box fixed-position" style="background: red;"></div>