| OLD | NEW | 
|    1 <!DOCTYPE html> |    1 <!DOCTYPE html> | 
|    2 <html> |    2 <html> | 
|    3 <head> |    3 <head> | 
|    4 <link href="resources/grid.css" rel="stylesheet"> |    4 <link href="resources/grid.css" rel="stylesheet"> | 
|    5 <style> |    5 <style> | 
|    6 .grid { |    6 .grid { | 
|    7     grid-template-columns: 20% 50% 30%; |    7     grid-template-columns: 20% 50% 30%; | 
|    8     grid-template-rows: 40%; |    8     grid-template-rows: 40%; | 
|    9 } |    9 } | 
|   10  |   10  | 
| (...skipping 10 matching lines...) Expand all  Loading... | 
|   21 .percentageSize { |   21 .percentageSize { | 
|   22     width: 50%; |   22     width: 50%; | 
|   23     height: 50%; |   23     height: 50%; | 
|   24 } |   24 } | 
|   25  |   25  | 
|   26 .indefiniteSize { |   26 .indefiniteSize { | 
|   27     width: -webkit-fit-content; |   27     width: -webkit-fit-content; | 
|   28     height: auto; |   28     height: auto; | 
|   29 } |   29 } | 
|   30  |   30  | 
|   31 .legacyIntrinsicSize { |   31 .fitContentSize { | 
|   32     width: intrinsic; |   32     width: fit-content; | 
|   33     height: intrinsic; |   33     height: fit-content; | 
|   34 } |   34 } | 
|   35  |   35  | 
|   36 .firstRowFirstColumn { |   36 .firstRowFirstColumn { | 
|   37     color: blue; |   37     color: blue; | 
|   38     background-color: cyan; |   38     background-color: cyan; | 
|   39 } |   39 } | 
|   40  |   40  | 
|   41 .firstRowSecondColumn { |   41 .firstRowSecondColumn { | 
|   42     color: green; |   42     color: green; | 
|   43     background-color: lime; |   43     background-color: lime; | 
| (...skipping 84 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
|  128  |  128  | 
|  129     <div class="unconstrainedContainer"> |  129     <div class="unconstrainedContainer"> | 
|  130         <div class="grid indefiniteSize"> |  130         <div class="grid indefiniteSize"> | 
|  131             <div class="firstRowFirstColumn sizedToGridArea" data-expected-width
     ="20" data-expected-height="10">XX</div> |  131             <div class="firstRowFirstColumn sizedToGridArea" data-expected-width
     ="20" data-expected-height="10">XX</div> | 
|  132             <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt
     h="50" data-expected-height="10">XXXXX</div> |  132             <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt
     h="50" data-expected-height="10">XXXXX</div> | 
|  133             <div class="firstRowThirdColumn sizedToGridArea" data-expected-width
     ="30" data-expected-height="10">XXX</div> |  133             <div class="firstRowThirdColumn sizedToGridArea" data-expected-width
     ="30" data-expected-height="10">XXX</div> | 
|  134         </div> |  134         </div> | 
|  135     </div> |  135     </div> | 
|  136  |  136  | 
|  137     <div class="indefiniteSize"> |  137     <div class="indefiniteSize"> | 
|  138         <div class="grid legacyIntrinsicSize"> |  138         <div class="grid fitContentSize"> | 
|  139             <div class="firstRowFirstColumn sizedToGridArea" data-expected-width
     ="20" data-expected-height="10">XX</div> |  139             <div class="firstRowFirstColumn sizedToGridArea" data-expected-width
     ="20" data-expected-height="10">XX</div> | 
|  140             <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt
     h="50" data-expected-height="10">XXXXX</div> |  140             <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt
     h="50" data-expected-height="10">XXXXX</div> | 
|  141             <div class="firstRowThirdColumn sizedToGridArea" data-expected-width
     ="30" data-expected-height="10">XXX</div> |  141             <div class="firstRowThirdColumn sizedToGridArea" data-expected-width
     ="30" data-expected-height="10">XXX</div> | 
|  142         </div> |  142         </div> | 
|  143     </div> |  143     </div> | 
|  144  |  144  | 
|  145     <div class="unconstrainedContainer"> |  145     <div class="unconstrainedContainer"> | 
|  146         <div class="grid legacyIntrinsicSize"> |  146         <div class="grid fitContentSize"> | 
|  147             <div class="firstRowFirstColumn sizedToGridArea" data-expected-width
     ="20" data-expected-height="10">XX</div> |  147             <div class="firstRowFirstColumn sizedToGridArea" data-expected-width
     ="20" data-expected-height="10">XX</div> | 
|  148             <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt
     h="50" data-expected-height="10">XXXXX</div> |  148             <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt
     h="50" data-expected-height="10">XXXXX</div> | 
|  149             <div class="firstRowThirdColumn sizedToGridArea" data-expected-width
     ="30" data-expected-height="10">XXX</div> |  149             <div class="firstRowThirdColumn sizedToGridArea" data-expected-width
     ="30" data-expected-height="10">XXX</div> | 
|  150         </div> |  150         </div> | 
|  151     </div> |  151     </div> | 
|  152  |  152  | 
|  153 </body> |  153 </body> | 
|  154 </html> |  154 </html> | 
| OLD | NEW |