contain-intrinsic-size-013.html (933B)
1 <!doctype html> 2 <html class="reftest-wait"> 3 <meta charset="utf8"> 4 <title>CSS contain-intrinsic-size: intrinsic-size changes.</title> 5 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> 6 <link rel="help" href="https://drafts.csswg.org/css-sizing-4/#intrinsic-size-override"> 7 <link rel="match" href="contain-intrinsic-size-013-ref.html"> 8 <meta name="assert" content="changes in intrinsic-size cause reflow"> 9 <script src="/common/reftest-wait.js"></script> 10 11 <style> 12 #border { 13 width: max-content; 14 border: 1px solid black; 15 } 16 #border > div { 17 contain-intrinsic-size: 55px 66px; 18 contain: size; 19 } 20 </style> 21 22 <div id=border><div id=target></div></div> 23 24 <script> 25 function changeStyle() { 26 document.getElementById("target").style = "contain-intrinsic-size: 77px 88px;"; 27 requestAnimationFrame(takeScreenshot); 28 } 29 30 onload = () => requestAnimationFrame(() => requestAnimationFrame(changeStyle)); 31 32 </script> 33 </html>