| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <head> |
| 4 <link href="resources/grid.css" rel="stylesheet"> |
| 5 <style type="text/css"> |
| 6 .grid { |
| 7 grid-definition-columns: 1fr 1fr; |
| 8 } |
| 9 |
| 10 #firstFloat { |
| 11 width: 50%; |
| 12 background-color: blue; |
| 13 } |
| 14 |
| 15 #secondFloat { |
| 16 float: right; |
| 17 width: 50%; |
| 18 background-color: lime; |
| 19 } |
| 20 </style> |
| 21 <script src="../../resources/js-test.js"></script> |
| 22 <script> |
| 23 function runTest() { |
| 24 if (window.testRunner) { |
| 25 testRunner.useUnfortunateSynchronousResizeMode(); |
| 26 testRunner.dumpAsText(); |
| 27 |
| 28 window.resizeTo(400, 400); |
| 29 window.resizeTo(600, 600); |
| 30 |
| 31 shouldBe("getComputedStyle(firstGrid, '').getPropertyValue('widt
h')", "getComputedStyle(firstFloat, '').getPropertyValue('width')"); |
| 32 shouldBe("getComputedStyle(secondGrid, '').getPropertyValue('wid
th')", "getComputedStyle(secondFloat, '').getPropertyValue('width')"); |
| 33 } |
| 34 } |
| 35 </script> |
| 36 </head> |
| 37 <body onLoad="runTest();"> |
| 38 <h1>Description</h1> |
| 39 <p>Grid flex columns width should be updated properly when you resize the wi
ndow (you should not see the grid background in grey color). It should work like
in the float case.</p> |
| 40 <h1>Grid</h1> |
| 41 <div class="grid"> |
| 42 <div id="firstGrid" class="firstRowFirstColumn">first column</div> |
| 43 <div id="secondGrid" class="firstRowSecondColumn">second column</div> |
| 44 </div> |
| 45 <h1>Float</h1> |
| 46 <div> |
| 47 <div id="secondFloat">second column</div> |
| 48 <div id="firstFloat">first column</div> |
| 49 </div> |
| 50 </body> |
| 51 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 146833018:
[CSS Grid Layout] Fix missing layout in flexible and content sized columns (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master