OLD | NEW |
1 <html> | 1 <html> |
2 <body style="margin: 0;"> | 2 <body style="margin: 0;"> |
3 <svg xmlns="http://www.w3.org/2000/svg"> | 3 <svg xmlns="http://www.w3.org/2000/svg"> |
4 <!-- The FO should be clipped with only the green half visible. --> | 4 <!-- The FO should be clipped with only the green half visible. --> |
5 <defs> | 5 <defs> |
6 <clipPath id="clip"> | 6 <clipPath id="clip"> |
7 <rect width="200" height="50"/> | 7 <rect width="200" height="50"/> |
8 </clipPath> | 8 </clipPath> |
9 </defs> | 9 </defs> |
10 <foreignObject width="200" height="100" clip-path="url(#clip)" opacity=".5"> | 10 <foreignObject width="200" height="100" clip-path="url(#clip)" opacity=".5"> |
11 <html xmlns="http://www.w3.org/1999/xhtml"> | 11 <html xmlns="http://www.w3.org/1999/xhtml"> |
12 <body> | 12 <body> |
13 <div style="background: green; height: 50px;"></div> | 13 <div style="background: #00FE00; height: 50px;"></div> |
14 <div style="background: red; height: 50px;"></div> | 14 <div style="background: #FE0000; height: 50px;"></div> |
15 </body> | 15 </body> |
16 </html> | 16 </html> |
17 </foreignObject> | 17 </foreignObject> |
18 </svg> | 18 </svg> |
19 </body> | 19 </body> |
20 </html> | 20 </html> |
OLD | NEW |