| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <link href="resources/grid.css" rel="stylesheet"> | 3 <link href="resources/grid.css" rel="stylesheet"> |
| 4 <link href="resources/grid-alignment.css" rel="stylesheet"> |
| 4 <style> | 5 <style> |
| 5 .gridAutoContent { | 6 .gridAutoContent { |
| 6 grid-template-columns: auto; | 7 grid-template-columns: auto; |
| 7 grid-template-rows: 50px; | 8 grid-template-rows: 50px; |
| 8 } | 9 } |
| 9 | 10 |
| 10 .firstRowFirstColumn { | 11 .firstRowFirstColumn { |
| 11 font: 10px/1 Ahem; | 12 font: 10px/1 Ahem; |
| 12 /* Make us fit our grid area. */ | 13 /* Make us fit our grid area. */ |
| 13 width: 100%; | 14 width: 100%; |
| 14 height: 100%; | 15 height: 100%; |
| 15 } | 16 } |
| 16 </style> | 17 </style> |
| 17 <script src="../../resources/check-layout.js"></script> | 18 <script src="../../resources/check-layout.js"></script> |
| 18 <body onload="checkLayout('.gridAutoContent');"> | 19 <body onload="checkLayout('.gridAutoContent');"> |
| 19 | 20 |
| 20 <p>Test that resolving auto tracks on grid items works properly.</p> | 21 <p>Test that resolving auto tracks on grid items works properly.</p> |
| 21 | 22 |
| 22 <div class="constrainedContainer"> | 23 <div class="constrainedContainer"> |
| 23 <div class="grid gridAutoContent"> | 24 <div class="grid gridAutoContent justifyContentStart"> |
| 24 <div class="firstRowFirstColumn" data-expected-width="30" data-expected-
height="50">XXX XXX XXX</div> | 25 <div class="firstRowFirstColumn" data-expected-width="30" data-expected-
height="50">XXX XXX XXX</div> |
| 25 </div> | 26 </div> |
| 26 </div> | 27 </div> |
| 27 | 28 |
| 28 <!-- Allow the extra logical space distribution to occur. --> | 29 <!-- Allow the extra logical space distribution to occur. --> |
| 29 <div style="width: 40px; height: 10px"> | 30 <div style="width: 40px; height: 10px"> |
| 30 <div class="grid gridAutoContent"> | 31 <div class="grid gridAutoContent justifyContentStart"> |
| 31 <div class="firstRowFirstColumn" data-expected-width="40" data-expected-
height="50">XX XX XX XX XX XX</div> | 32 <div class="firstRowFirstColumn" data-expected-width="40" data-expected-
height="50">XX XX XX XX XX XX</div> |
| 32 </div> | 33 </div> |
| 33 </div> | 34 </div> |
| 34 | 35 |
| 35 <div style="width: 100px; height: 10px;"> | 36 <div style="width: 100px; height: 10px;"> |
| 36 <div class="grid gridAutoContent"> | 37 <div class="grid gridAutoContent justifyContentStart"> |
| 37 <div class="firstRowFirstColumn" data-expected-width="50" data-expected-
height="50">XXXXX</div> | 38 <div class="firstRowFirstColumn" data-expected-width="50" data-expected-
height="50">XXXXX</div> |
| 38 </div> | 39 </div> |
| 39 </div> | 40 </div> |
| 40 | 41 |
| 41 </body> | 42 </body> |
| 42 </html> | 43 </html> |
| OLD | NEW |