| OLD | NEW | 
| (Empty) |  | 
 |   1 <!DOCTYPE html> | 
 |   2 <html> | 
 |   3 <head> | 
 |   4 <script> | 
 |   5 if (window.testRunner) | 
 |   6     testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); | 
 |   7 </script> | 
 |   8 <link href="resources/grid.css" rel="stylesheet"> | 
 |   9 <style> | 
 |  10 .grid { | 
 |  11     grid-definition-rows: 100px; | 
 |  12     grid-definition-columns: 100px; | 
 |  13     width: -webkit-fit-content; | 
 |  14 } | 
 |  15 .sizedToGridArea { | 
 |  16     background-color: green; | 
 |  17 } | 
 |  18  | 
 |  19 .red { | 
 |  20     background-color: red; | 
 |  21 } | 
 |  22  | 
 |  23 .negativeOrder { | 
 |  24     order: -1; | 
 |  25 } | 
 |  26  | 
 |  27 .positiveOrder { | 
 |  28     order: 10; | 
 |  29 } | 
 |  30 </style> | 
 |  31 </head> | 
 |  32 <body> | 
 |  33     <p>This test checks that 'order' changes the paint ordering.</p> | 
 |  34     <p>There should be 2 green squares below.</p> | 
 |  35     <div class="grid"> | 
 |  36         <div class="sizedToGridArea firstRowFirstColumn"></div> | 
 |  37         <div class="sizedToGridArea firstRowFirstColumn negativeOrder red"></div
    > | 
 |  38     </div> | 
 |  39  | 
 |  40     <div class="grid"> | 
 |  41         <div class="sizedToGridArea firstRowFirstColumn positiveOrder"></div> | 
 |  42         <div class="sizedToGridArea firstRowFirstColumn red"></div> | 
 |  43     </div> | 
 |  44 </body> | 
 |  45 </html> | 
| OLD | NEW |