| <!doctype html> |
| |
| <style> |
| svg { |
| width: 100px; |
| height: 100px; |
| margin: 1px; |
| } |
| |
| #test-root { |
| position: absolute; |
| left: 10px; |
| top: 10px; |
| } |
| |
| #test-child { |
| position: absolute; |
| left: 10px; |
| top: 130px; |
| } |
| </style> |
| |
| <p id="test-root"> |
| |
| <!-- SVG root element: the first three filters are valid, the rest are not. --> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="lime" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="lime" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="lime" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="red" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="red" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="red" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="red" x="0" y="0" height="50" width="50"/> |
| </svg> |
| </p> |
| |
| <p id="test-child"> |
| |
| <!-- SVG child element: the first filter is valid, the rest are not. --> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="lime" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="lime" x="0" y="0" height="50" width="50"/> |
| </svg> |
| |
| <svg viewBox="0 0 50 50"> |
| <rect fill="lime" x="0" y="0" height="50" width="50"/> |
| </svg> |
| </p> |