position-visibility-no-overflow-without-anchor.html (857B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Anchor Positioning Test: position-visibility: no-overflow without an anchor</title> 4 <link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/#position-visibility"> 5 <link rel="match" href="position-visibility-no-overflow-ref.html"> 6 <style> 7 #container { 8 position: relative; 9 width: 400px; 10 height: 150px; 11 } 12 13 .anchor { 14 width: 100px; 15 height: 100px; 16 background: orange; 17 display: inline-block; 18 } 19 20 .target { 21 position: absolute; 22 position-visibility: no-overflow; 23 width: 100px; 24 height: 200px; 25 background: red; 26 top: 0; 27 left: 0; 28 } 29 </style> 30 31 <div id="container"> 32 <div class="anchor">anchor1</div> 33 <!-- #target1 should not be visible because it overflows the containing block. --> 34 <div id="target1" class="target">target1</div> 35 </div>