offset-anchor-transform-box-fill-box-002.html (666B)
1 <!DOCTYPE html> 2 <title>CSS Motion Path: offset-anchor with transform-box: fill-box</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"> 6 <style> 7 #target { 8 transform-box: fill-box; 9 transform-origin: 50% 50%; 10 offset-anchor: 25% 25%; 11 offset-path: path("M75,-25v100"); 12 offset-distance: 50%; 13 } 14 </style> 15 <svg width="400" height="400"> 16 <rect width="100" height="100" fill="red"/> 17 <rect id="target" x="150" y="100" width="100" height="100" fill="green"/> 18 </svg>