position-fixed-inside-clip-path-ref.html (448B)
1 <!DOCTYPE html> 2 <html> 3 <style> 4 body { 5 height: 4000px; 6 margin: 0; 7 overflow: hidden; 8 } 9 #clip { 10 position: absolute; 11 top: 450px; 12 left: 300px; 13 background: red; 14 width: 400px; 15 height: 400px; 16 clip-path: inset(0); 17 } 18 #fixed { 19 position: fixed; 20 top: 0; 21 left: 0; 22 right: 0; 23 bottom: 0; 24 background: linear-gradient(green, blue); 25 } 26 </style> 27 <div id="clip"> 28 <div id="fixed"></div> 29 </div>