| <!DOCTYPE html> | |
| <style> | |
| body { margin: 0; } | |
| .clipped { | |
| background-color: green; | |
| border: 5px solid red; | |
| -webkit-clip-path: url(#c); | |
| clip-path: url(#c); | |
| } | |
| </style> | |
| <div style="columns: 2; column-gap: 0; width: 200px; height: 100px"> | |
| <div style="height: 100px"></div> | |
| <div style="height: 90px" class="clipped"></div> | |
| </div> | |
| <svg> | |
| <clipPath id="c" clipPathUnits="userSpaceOnUse"> | |
| <rect x="5" y="5" width="90" height="90"/> | |
| </clipPath> | |
| </svg> |