old-content-object-view-box-overflow-ref.html (721B)
1 <!DOCTYPE html> 2 <title>View transitions: object-view-box with larger overflow (ref)</title> 3 <link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/"> 4 <link rel="author" href="mailto:vmpstr@chromium.org"> 5 <style> 6 .target { 7 color: red; 8 width: 100px; 9 height: 100px; 10 contain: paint; 11 position: relative; 12 top: 50px; 13 left: 50px; 14 } 15 .child { 16 width: 123px; 17 height: 150px; 18 background: lightblue; 19 position: relative; 20 top: -10px; 21 left: -20px; 22 } 23 .grandchild { 24 width: 25px; 25 height: 25px; 26 position: relative; 27 top: 20px; 28 left: 40px; 29 background: green; 30 } 31 body { background: lightpink; } 32 </style> 33 34 <div class=target> 35 <div class=child> 36 <div class=grandchild></div> 37 </div> 38 </div>