OLD | NEW |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet"> | 4 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet"> |
5 <link href="../css-intrinsic-dimensions/resources/height-keyword-classes.css" re l="stylesheet"> | 5 <link href="../css-intrinsic-dimensions/resources/height-keyword-classes.css" re l="stylesheet"> |
6 <link href="resources/grid.css" rel="stylesheet"> | 6 <link href="resources/grid.css" rel="stylesheet"> |
7 <link href="resources/grid-alignment.css" rel="stylesheet"> | 7 <link href="resources/grid-alignment.css" rel="stylesheet"> |
8 <style> | 8 <style> |
9 .grid { | 9 .grid { |
10 grid-template-columns: 20% 50% 30%; | 10 grid-template-columns: 20% 50% 30%; |
(...skipping 67 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
78 <div class="indefiniteHeight"> | 78 <div class="indefiniteHeight"> |
79 <div class="grid fixedSize"> | 79 <div class="grid fixedSize"> |
80 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="80" data-expected-height="160">XX</div> | 80 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="80" data-expected-height="160">XX</div> |
81 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="200" data-expected-height="160">XXXXX</div> | 81 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="200" data-expected-height="160">XXXXX</div> |
82 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="120" data-expected-height="160">XXX</div> | 82 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="120" data-expected-height="160">XXX</div> |
83 </div> | 83 </div> |
84 </div> | 84 </div> |
85 | 85 |
86 <div class="fit-content indefiniteHeight"> | 86 <div class="fit-content indefiniteHeight"> |
87 <div class="grid calculatedSize justifyContentStart"> | 87 <div class="grid calculatedSize justifyContentStart"> |
88 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="20" data-expected-height="10">XX</div> | 88 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="44" data-expected-height="10">XX</div> |
89 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="50" data-expected-height="10">XXXXX</div> | 89 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="110" data-expected-height="10">XXXXX</div> |
90 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="30" data-expected-height="10">XXX</div> | 90 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="66" data-expected-height="10">XXX</div> |
91 </div> | 91 </div> |
92 </div> | 92 </div> |
93 | 93 |
94 <div class="unconstrainedContainer"> | 94 <div class="unconstrainedContainer"> |
95 <div class="grid calculatedSize"> | 95 <div class="grid calculatedSize"> |
96 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="80" data-expected-height="160">XX</div> | 96 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="80" data-expected-height="160">XX</div> |
97 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="200" data-expected-height="160">XXXXX</div> | 97 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="200" data-expected-height="160">XXXXX</div> |
98 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="120" data-expected-height="160">XXX</div> | 98 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="120" data-expected-height="160">XXX</div> |
99 </div> | 99 </div> |
100 </div> | 100 </div> |
101 | 101 |
102 <div class="fit-content indefiniteHeight"> | 102 <div class="fit-content indefiniteHeight"> |
103 <div class="grid percentageSize"> | 103 <div class="grid percentageSize justifyContentStart"> |
svillar
2016/06/08 10:38:03
why justifyContentStart?
Manuel Rego
2016/06/08 11:56:30
This was not needed, just a copy&paste from above.
| |
104 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="20" data-expected-height="10">XX</div> | 104 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="10" data-expected-height="10">XX</div> |
105 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="50" data-expected-height="10">XXXXX</div> | 105 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="25" data-expected-height="10">XXXXX</div> |
106 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="30" data-expected-height="10">XXX</div> | 106 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="15" data-expected-height="10">XXX</div> |
107 </div> | 107 </div> |
108 </div> | 108 </div> |
109 | 109 |
110 <div class="unconstrainedContainer"> | 110 <div class="unconstrainedContainer"> |
111 <div class="grid percentageSize"> | 111 <div class="grid percentageSize"> |
112 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="100" data-expected-height="200">XX</div> | 112 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="100" data-expected-height="200">XX</div> |
113 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="250" data-expected-height="200">XXXXX</div> | 113 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="250" data-expected-height="200">XXXXX</div> |
114 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="150" data-expected-height="200">XXX</div> | 114 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="150" data-expected-height="200">XXX</div> |
115 </div> | 115 </div> |
116 </div> | 116 </div> |
(...skipping 25 matching lines...) Expand all Loading... | |
142 <div class="unconstrainedContainer"> | 142 <div class="unconstrainedContainer"> |
143 <div class="grid fit-content"> | 143 <div class="grid fit-content"> |
144 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="20" data-expected-height="10">XX</div> | 144 <div class="firstRowFirstColumn sizedToGridArea" data-expected-width ="20" data-expected-height="10">XX</div> |
145 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="50" data-expected-height="10">XXXXX</div> | 145 <div class="firstRowSecondColumn sizedToGridArea" data-expected-widt h="50" data-expected-height="10">XXXXX</div> |
146 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="30" data-expected-height="10">XXX</div> | 146 <div class="firstRowThirdColumn sizedToGridArea" data-expected-width ="30" data-expected-height="10">XXX</div> |
147 </div> | 147 </div> |
148 </div> | 148 </div> |
149 | 149 |
150 </body> | 150 </body> |
151 </html> | 151 </html> |
OLD | NEW |