| 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 .indefiniteSizeGrid { | 4 .indefiniteSizeGrid { |
| 5 font: 10px/1 Ahem; | 5 font: 10px/1 Ahem; |
| 6 width: -webkit-min-content; |
| 6 } | 7 } |
| 7 .gridWithPercent { | 8 .gridWithPercent { |
| 8 grid-template-columns: 25%; | 9 grid-template-columns: 25%; |
| 9 grid-template-rows: 30%; | 10 grid-template-rows: 30%; |
| 10 } | 11 } |
| 11 .gridWithPercentInMinOfMinMax { | 12 .gridWithPercentInMinOfMinMax { |
| 12 grid-template-columns: minmax(20%, max-content); | 13 grid-template-columns: minmax(20%, max-content); |
| 13 grid-template-rows: minmax(100%, 15px); | 14 grid-template-rows: minmax(100%, 15px); |
| 14 } | 15 } |
| 15 .gridWithPercentInMinOfMinMax2 { | 16 .gridWithPercentInMinOfMinMax2 { |
| (...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 58 <div class="indefiniteSizeGrid gridWithPercentInMaxOfMinMax2" data-expected-
width="20" data-expected-height="20"> | 59 <div class="indefiniteSizeGrid gridWithPercentInMaxOfMinMax2" data-expected-
width="20" data-expected-height="20"> |
| 59 <div class="firstRowFirstColumn">XXXX<br>X</div> | 60 <div class="firstRowFirstColumn">XXXX<br>X</div> |
| 60 </div> | 61 </div> |
| 61 </div> | 62 </div> |
| 62 <div style="position: relative;"> | 63 <div style="position: relative;"> |
| 63 <div class="indefiniteSizeGrid gridWithPercentsInMinMax" data-expected-width
="40" data-expected-height="40"> | 64 <div class="indefiniteSizeGrid gridWithPercentsInMinMax" data-expected-width
="40" data-expected-height="40"> |
| 64 <div class="firstRowFirstColumn">XXX<br>XX XX<br>XXXX</div> | 65 <div class="firstRowFirstColumn">XXX<br>XX XX<br>XXXX</div> |
| 65 </div> | 66 </div> |
| 66 </div> | 67 </div> |
| 67 </body> | 68 </body> |
| OLD | NEW |