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 <style> | 4 <style> |
5 .gridMaxMaxContent { | 5 .gridMaxMaxContent { |
6 grid-template-columns: 50px; | 6 grid-template-columns: 50px; |
7 grid-template-rows: minmax(10px, max-content) minmax(10px, 1fr); | 7 grid-template-rows: minmax(10px, max-content) minmax(10px, 1fr); |
8 } | 8 } |
9 | 9 |
10 .gridMinMinContent { | 10 .gridMinMinContent { |
(...skipping 81 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
92 </div> | 92 </div> |
93 | 93 |
94 <!-- Allow the extra logical space distribution to occur. --> | 94 <!-- Allow the extra logical space distribution to occur. --> |
95 <div style="width: 10px; height: 40px"> | 95 <div style="width: 10px; height: 40px"> |
96 <div class="grid gridMinMinContent" style="height: 100%"> | 96 <div class="grid gridMinMinContent" style="height: 100%"> |
97 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="10">XXXXX XXXX</div> | 97 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="10">XXXXX XXXX</div> |
98 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="30">XXXXX XXXX</div> | 98 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="30">XXXXX XXXX</div> |
99 </div> | 99 </div> |
100 </div> | 100 </div> |
101 | 101 |
102 <div style="width: 10px; height: 40px"> | 102 <div class="grid gridMinMinContent" style="height: 40px"> |
103 <div class="grid gridMinMinContent"> | 103 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50" da
ta-expected-height="10">XXXXX XXXX</div> |
104 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="20">XXXXX XXXX</div> | 104 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="50" d
ata-expected-height="30">XXXXX XXXX</div> |
105 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="50">XXXXX XXXX</div> | |
106 </div> | |
107 </div> | 105 </div> |
108 | 106 |
109 <div style="width: 10px; height: 110px;"> | 107 <div style="width: 10px; height: 110px;"> |
110 <div class="grid gridMinMinContent" style="height: 100%"> | 108 <div class="grid gridMinMinContent" style="height: 100%"> |
111 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="60">XXXXX XXXX</div> | 109 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="60">XXXXX XXXX</div> |
112 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="50">XXXXX XXXX</div> | 110 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="50">XXXXX XXXX</div> |
113 </div> | 111 </div> |
114 </div> | 112 </div> |
115 | 113 |
116 <div style="width: 10px; height: 110px;"> | 114 <div style="width: 10px; height: 110px;"> |
(...skipping 83 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
200 <div class="grid gridWithNonFlexingItems"> | 198 <div class="grid gridWithNonFlexingItems"> |
201 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="40"></div> | 199 <div class="sizedToGridArea firstRowFirstColumn" data-expected-width="50
" data-expected-height="40"></div> |
202 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="40">XXXXX XXXXX XXXXX XXXXX</div> | 200 <div class="sizedToGridArea secondRowFirstColumn" data-expected-width="5
0" data-expected-height="40">XXXXX XXXXX XXXXX XXXXX</div> |
203 <div class="sizedToGridArea thirdRowFirstColumn" data-expected-width="50
" data-expected-height="60">XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX</div> | 201 <div class="sizedToGridArea thirdRowFirstColumn" data-expected-width="50
" data-expected-height="60">XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX</div> |
204 <div class="sizedToGridArea fourthRowFirstColumn" data-expected-width="5
0" data-expected-height="80"></div> | 202 <div class="sizedToGridArea fourthRowFirstColumn" data-expected-width="5
0" data-expected-height="80"></div> |
205 </div> | 203 </div> |
206 </div> | 204 </div> |
207 | 205 |
208 </body> | 206 </body> |
209 </html> | 207 </html> |
OLD | NEW |