contain-paint-clip-019.html (966B)
1 <!DOCTYPE html> 2 3 <meta charset="UTF-8"> 4 5 <title>CSS Containment Test: 'contain: paint' and clipping prevents scrollbars</title> 6 7 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> 8 <link rel="help" href="https://www.w3.org/TR/css-contain-1/#containment-paint"> 9 <link rel="match" href="reference/contain-paint-clip-019-ref.html"> 10 11 <meta content="This test checks that the paint containment of an element clips contents. 12 It should also prevent layout overflow from being propagated to ancestors." name="assert"> 13 14 <style> 15 #container { 16 contain: paint; 17 width: 100px; 18 height: 100px; 19 } 20 #green { 21 background-color: green; 22 width: 100px; 23 height: 100px; 24 } 25 #red { 26 background-color: red; 27 width: 100px; 28 height: 10000px; 29 } 30 </style> 31 32 <p>Test passes if there there is a green square. No red and no scrollbars should be visible.</p> 33 34 <div id="container"> 35 <div id="green"></div> 36 <div id="red"></div> 37 </div>