layout/reftests/svg/svg-integration/clipPath-transformed-html-02.xhtml@925c144e1f1f
layout/reftests/svg/svg-integration/clipPath-transformed-html-02.xhtml
Fri, 16 Jan 2015 18:13:44 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Fri, 16 Jan 2015 18:13:44 +0100
- branch
- TOR_BUG_9701
- changeset 14
- 925c144e1f1f
- permissions
- -rw-r--r--
Integrate suggestion from review to improve consistency with existing code.
1 <!--
2 Any copyright is dedicated to the Public Domain.
3 http://creativecommons.org/publicdomain/zero/1.0/
4 -->
5 <html xmlns="http://www.w3.org/1999/xhtml">
6 <head>
7 <title>Test SVG clipPath clipping of transformed HTML elements</title>
8 <!-- From https://bugzilla.mozilla.org/show_bug.cgi?id=773197 -->
9 <style type="text/css">
11 * { margin: 0; border: 0; padding: 0;}
13 div {
14 position: absolute;
15 left: 50px;
16 top: 50px;
17 width: 150px;
18 height: 150px;
19 transform: scale(2,2);
20 transform-origin: 0 0;
21 }
23 </style>
24 </head>
25 <body bgcolor="lime">
27 <svg xmlns="http://www.w3.org/2000/svg" width="350" height="350"
28 style="display:block; position:absolute;">
29 <clipPath id="cp1" x="0" y="0" width="1" height="1" clipPathUnits="objectBoundingBox">
30 <circle cx="0.5" cy="0.5" r="0.01" fill="white"/>
31 <circle cx="0.5" cy="0.5" r="0.48" fill="white"/>
32 </clipPath>
33 <clipPath id="cp2" x="0" y="0" width="1" height="1" clipPathUnits="objectBoundingBox">
34 <circle cx="0.5" cy="0.5" r="0.01" fill="white"/>
35 <circle cx="0.5" cy="0.5" r="0.50" fill="white"/>
36 </clipPath>
37 <circle cx="200" cy="200" r="147" fill="red"/>
38 </svg>
40 <div style="background: red; clip-path: url(#cp1);"/>
41 <div style="background: lime; clip-path: url(#cp2);"/>
43 </body>
44 </html>
