| <!DOCTYPE html> |
| <html> |
| <head> |
| <link href="resources/grid.css" rel="stylesheet"> |
| <style type="text/css"> |
| #grid-1 { |
| grid-template-columns: 1fr 1fr; |
| } |
| |
| #grid-2 { |
| grid-template-columns: auto; |
| } |
| </style> |
| <script> |
| window.onload = function () { |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| } |
| |
| // Prevent WebKit1 hangs by ensuring layout is up-to-date before resize. |
| setTimeout(function() { window.resizeTo(600, 600); }, 0); |
| } |
| |
| window.onresize = function () { |
| if (window.testRunner) { |
| testRunner.notifyDone(); |
| } |
| } |
| </script> |
| </head> |
| <body> |
| <h1>Description</h1> |
| <p>Grid flex and content sized columns width should be updated properly when you resize the window (you should not see the grid background in grey color).</p> |
| <h1>Grid 2 flex columns</h1> |
| <div id="grid-1" class="grid"> |
| <div class="firstRowFirstColumn">first column</div> |
| <div class="firstRowSecondColumn">second column</div> |
| </div> |
| <h1>Grid 1 auto column</h1> |
| <div id="grid-2" class="grid"> |
| <div class="firstRowFirstColumn"> |
| one column one column one column one column one column one column one column one column |
| one column one column one column one column one column one column one column one column |
| one column one column one column one column one column one column one column one column |
| one column one column one column one column one column one column one column one column |
| </div> |
| </div> |
| </body> |
| </html> |
