| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <link href="resources/grid.css" rel="stylesheet"> | 2 <link href="resources/grid.css" rel="stylesheet"> |
| 3 <style> | 3 <style> |
| 4 .grid { | 4 .grid { |
| 5 grid-template: 1fr / 50px 1fr; | 5 grid-template: 50px 1fr / 1fr; |
| 6 | 6 |
| 7 position: absolute; | 7 position: absolute; |
| 8 left: 50px; | 8 left: 50px; |
| 9 top: 50px; | 9 top: 50px; |
| 10 | 10 |
| 11 width: 200px; | 11 width: 200px; |
| 12 height: 200px; | 12 height: 200px; |
| 13 | 13 |
| 14 border: 7px solid #ccc; | 14 border: 7px solid #ccc; |
| 15 font: 10px/1 Ahem; | 15 font: 10px/1 Ahem; |
| (...skipping 13 matching lines...) Expand all Loading... |
| 29 <p>Items should extend to fill the width of the absolutely positioned grid conta
iner.</p> | 29 <p>Items should extend to fill the width of the absolutely positioned grid conta
iner.</p> |
| 30 <script src="../../resources/check-layout.js"></script> | 30 <script src="../../resources/check-layout.js"></script> |
| 31 <body onload="checkLayout('.grid')"> | 31 <body onload="checkLayout('.grid')"> |
| 32 | 32 |
| 33 <div class="grid"> | 33 <div class="grid"> |
| 34 <div class="row1" data-expected-height="50" data-expected-width="200">XXX X
</div> | 34 <div class="row1" data-expected-height="50" data-expected-width="200">XXX X
</div> |
| 35 <div class="row2" data-expected-height="150" data-expected-width="200">XX XX
X XX</div> | 35 <div class="row2" data-expected-height="150" data-expected-width="200">XX XX
X XX</div> |
| 36 </div> | 36 </div> |
| 37 | 37 |
| 38 </body> | 38 </body> |
| OLD | NEW |