firefox-main/testing/web-platform/tests/css/css-borders/tentative/border-shape/border-shape-geometry-box-ref.html

Source code

Revision control

Copy as Markdown

Other Tools

<!DOCTYPE html>
<style>
body {
margin: 0;
}
.container {
display: inline-block;
}
svg {
display: block;
}
</style>
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160">
<rect width="160" height="160" fill="palegoldenrod" />
<rect x="10" y="10" width="140" height="140" fill="thistle" />
<rect x="30" y="30" width="100" height="100" fill="lightblue" />
</svg>
</div>
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160">
<rect width="160" height="160" fill="yellow" />
<rect x="10" y="10" width="140" height="140" fill="palegoldenrod" />
<rect x="20" y="20" width="120" height="120" fill="thistle" />
<rect x="30" y="30" width="100" height="100" fill="lightblue" />
</svg>
</div>
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160">
<rect width="160" height="160" fill="yellow" />
<rect x="20" y="20" width="120" height="120" fill="palegoldenrod" />
<rect x="30" y="30" width="100" height="100" fill="lightblue" />
</svg>
</div>
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160">
<rect width="160" height="160" fill="palegoldenrod" />
<rect x="30" y="30" width="100" height="100" fill="lightblue" />
</svg>
</div>