grid-relayout-with-nested-grid.html (986B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <head> 4 <meta charset="utf-8"> 5 <link rel="author" title="Brandon Stewart" href="mailto:brandonstewart@apple.com"> 6 <link rel="help" href="https://drafts.csswg.org/css-grid-1"> 7 <link rel="match" href="grid-relayout-with-nested-grid-ref.html"> 8 <meta name="assert" content="Ensure text does not overflow upon re-layout of grid"> 9 </head> 10 <style> 11 .grid { 12 display: grid; 13 grid-template-columns: minmax(min-content, 100px) auto; 14 } 15 .nested_grid { 16 border: 5px solid; 17 display: grid; 18 justify-items: baseline; 19 overflow-wrap: break-word; 20 } 21 </style> 22 <body> 23 <div class=grid> 24 <div id="extra_div1"> 25 <div> 26 <div class=nested_grid><p>This content will overflow.</p></div> 27 </div> 28 </div> 29 </div> 30 </body> 31 <script> 32 /* Force a re-layout */ 33 document.body.offsetHeight; 34 document.getElementById("extra_div1").appendChild(document.createElement("p")); 35 document.documentElement.classList.remove("reftest-wait"); 36 forceLayout(); 37 </script> 38 </html>