contain-body-overflow-002.html (926B)
1 <!doctype html> 2 <html lang=en class="reftest-wait"> 3 <meta charset=utf-8> 4 <title>CSS-contain test: paint containment on body prevents overflow propagation</title> 5 <link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net"> 6 <meta name="assert" content="paint containment on body prevents overflow propagation"> 7 <link rel="match" href="reference/contain-body-overflow-001-ref.html"> 8 <link rel="help" href="https://drafts.csswg.org/css-contain-1/#contain-property"> 9 <style> 10 html, body, p, div { 11 margin: 0; 12 width: 200px; 13 height: 200px; 14 } 15 div { background: red; } 16 body { 17 overflow: hidden; 18 contain: paint; 19 } 20 :focus { 21 outline: none; 22 } 23 </style> 24 25 <div></div> 26 <p tabindex=1 id=target>Test passes if there is no red. 27 <script> 28 window.onload = function() { 29 document.getElementById("target").focus(); 30 setTimeout(() => { 31 document.documentElement.className = ""; 32 }, 0); 33 } 34 </script>