| <svg viewBox="0 0 800 600" width="400" height="500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |
| <defs> |
| <title>Green rectangles should be within the red frames</title> |
| <rect id="rect" width="100" height="100" fill="green"/> |
| |
| <filter id="filter1" > |
| <feImage preserveAspectRatio="none" x="0%" y="0%" width="100%" height="100%" xlink:href="#rect"/> |
| </filter> |
| |
| <filter id="filter2" > |
| <feImage preserveAspectRatio="none" xlink:href="#rect"/> |
| </filter> |
| |
| <filter id="filter3" > |
| <feImage preserveAspectRatio="none" x="0%" y="0%" width="100%" height="100%" xlink:href="resources/green.png"/> |
| </filter> |
| |
| <filter id="filter4" > |
| <feImage preserveAspectRatio="none" xlink:href="resources/green.png"/> |
| </filter> |
| </defs> |
| |
| <g transform="translate(50, 10)"> |
| <rect width="400" height="200" fill="green" filter="url(#filter1)"/> |
| <g transform="translate(0, 250)"> |
| <rect width="400" height="200" fill="green" filter="url(#filter2)"/> |
| </g> |
| </g> |
| |
| <g transform="translate(250, 10)"> |
| <rect width="400" height="200" fill="green" filter="url(#filter3)"/> |
| <g transform="translate(0, 250)"> |
| <rect width="400" height="200" fill="green" filter="url(#filter4)"/> |
| </g> |
| </g> |
| |
| <rect fill="none" stroke="red" x="50" y="10" width="100" height="100"/> |
| <rect fill="none" stroke="red" x="10" y="240" width="100" height="100"/> |
| <rect fill="none" stroke="red" x="250" y="10" width="440" height="220"/> |
| <rect fill="none" stroke="red" x="210" y="240" width="480" height="240"/> |
| |
| </svg> |
| |