diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-28 14:29:10 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-28 14:29:10 +0000 |
| commit | 2aa4a82499d4becd2284cdb482213d541b8804dd (patch) | |
| tree | b80bf8bf13c3766139fbacc530efd0dd9d54394c /layout/reftests/svg/geometry-properties-in-css.html | |
| parent | Initial commit. (diff) | |
| download | firefox-2aa4a82499d4becd2284cdb482213d541b8804dd.tar.xz firefox-2aa4a82499d4becd2284cdb482213d541b8804dd.zip | |
Adding upstream version 86.0.1.upstream/86.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'layout/reftests/svg/geometry-properties-in-css.html')
| -rw-r--r-- | layout/reftests/svg/geometry-properties-in-css.html | 92 |
1 files changed, 92 insertions, 0 deletions
diff --git a/layout/reftests/svg/geometry-properties-in-css.html b/layout/reftests/svg/geometry-properties-in-css.html new file mode 100644 index 0000000000..a17795f3f3 --- /dev/null +++ b/layout/reftests/svg/geometry-properties-in-css.html @@ -0,0 +1,92 @@ +<!doctype html> +<style> + svg { + width: 800px; + height: 600px; + font-size: 10px; + } + svg svg { + width: 80px; + height: 80px; + } + rect:first-child { + x: 40px; + y: calc(5% + 10px); + width: calc(80px + 2em); + height: 10em; + rx: auto; + ry: 5%; + cx: 100px; + cy: 200px; + } + circle { + r: calc(70px); + } + g > #c2 { + cx: 80px; + cy: calc(20% + 10px); + x: 40px; + y: calc(5% + 10px); + } + svg > svg > ellipse { + cx: 30%; + cy: 100px; + rx: 20px; + ry: 40px; + } + svg > svg > ellipse:nth-child(2) { + transform: translate(50px, -50px); + } + svg ellipse { + cx: 10px; + cy: 10px; + rx: 10px; + ry: 10px; + } + foreignObject { + transform: translate(450px,0); + y: 200px; + width: 80px; + height: 130px; + } + #r2 { + width: 50px; + height:50px; + } + svg image { + x: 300px; + y: 260px; + height: 50px; + } + use { + x:400px; + y:310px; + } +</style> +<svg> + <g> + <rect x="0" y="-10" width="30px" height="10px" rx="-5px" ry="auto" fill="purple" /> + <rect x=" 40px /* some nonsense */ " y="150" width="30" height="20em" rx="20px" ry="20px" fill="magenta" /> + </g> + <circle cx="/* more nonsense */ 170" cy="340" r="-5px" fill="pink" /> + <g transform="translate(150,0)"> + <circle id="c2" cx="20" cy="40" fill="skyblue" /> + </g> + <svg x="300" width="200px" height="200px" viewBox="0 0 100 100"> + <ellipse fill="cyan" /> + <ellipse fill="navy" /> + </svg> + <foreignObject> + <svg> + <rect id="r2" style="x:0;y:0" fill="brown" /> + </svg> + </foreignObject> + <image href="data:image/svg+xml,<svg width='10' height='10' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='red' /></svg>" /> + <defs> + <g id="g"> + <rect display="none"/> + <rect width="80" height="80" fill="skyblue" /> + </g> + </defs> + <use href="#g"/> +</svg> |