offset-anchor-transform-box-fill-box-003.html (692B)
1 <!DOCTYPE html> 2 <title>CSS Motion Path: offset-anchor with transform-box: fill-box on the svg g element</title> 3 <link rel="help" href="https://drafts.fxtf.org/motion-1/#offset-anchor-property"> 4 <link rel="match" href="offset-anchor-transform-box-fill-box-ref.html"> 5 <meta name="assert" content="Tests offset-anchor together with a fill-box transform-box on the <g> element"> 6 <style> 7 #target { 8 transform-box: fill-box; 9 offset-anchor: 25% 25%; 10 offset-path: path("M75,-25v100"); 11 offset-distance: 50%; 12 } 13 </style> 14 <svg width="400" height="400"> 15 <rect width="100" height="100" fill="red"/> 16 <g id='target'> 17 <rect x="150" y="100" width="100" height="100" fill="green"/> 18 </g> 19 </svg>