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-rows: 20px; | 7 grid-template-rows: 20px; |
8 grid-template-columns: 10px; | 8 grid-template-columns: 10px; |
9 grid-auto-rows: 30px; | 9 grid-auto-rows: 30px; |
10 grid-auto-columns: 50px; | 10 grid-auto-columns: 50px; |
(...skipping 49 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
60 updateAndCheck("constrainedGridUndefinedHeight", { 'rows': 'auto', 'columns'
: 'auto' }, { 'width': '60', 'height': '20' }); | 60 updateAndCheck("constrainedGridUndefinedHeight", { 'rows': 'auto', 'columns'
: 'auto' }, { 'width': '60', 'height': '20' }); |
61 } | 61 } |
62 | 62 |
63 window.addEventListener("load", updateGridAutoRowsColumns, false); | 63 window.addEventListener("load", updateGridAutoRowsColumns, false); |
64 </script> | 64 </script> |
65 <body> | 65 <body> |
66 | 66 |
67 <div>This test checks that grid-auto-{row|column} updates properly recomputes th
e grid items' sizes.</div> | 67 <div>This test checks that grid-auto-{row|column} updates properly recomputes th
e grid items' sizes.</div> |
68 | 68 |
69 <div class="constrainedContainer" style="position: relative"> | 69 <div class="constrainedContainer" style="position: relative"> |
70 <div class="grid" id="constrainedGrid" style="height: 100%"> | 70 <div class="grid" id="constrainedGrid" style="height: 100%; width: 100%;"> |
71 <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="10" da
ta-offset-y="20" data-expected-width="50" data-expected-height="30">XXXXX XXXXXX
</div> | 71 <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="10" da
ta-offset-y="20" data-expected-width="50" data-expected-height="30">XXXXX XXXXXX
</div> |
72 </div> | 72 </div> |
73 </div> | 73 </div> |
74 | 74 |
75 <div class="unconstrainedContainer" style="position: relative"> | 75 <div class="unconstrainedContainer" style="position: relative"> |
76 <div class="grid" id="unconstrainedGrid"> | 76 <div class="grid" id="unconstrainedGrid"> |
77 <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="10" da
ta-offset-y="20" data-expected-width="50" data-expected-height="30">XXXXX XXXXXX
</div> | 77 <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="10" da
ta-offset-y="20" data-expected-width="50" data-expected-height="30">XXXXX XXXXXX
</div> |
78 </div> | 78 </div> |
79 </div> | 79 </div> |
80 | 80 |
81 <div class="constrainedContainer" style="position: relative;"> | 81 <div class="constrainedContainer" style="position: relative;"> |
82 <div class="grid" id="constrainedGridUndefinedHeight"> | 82 <div class="grid" id="constrainedGridUndefinedHeight" style="width: 100%;"> |
83 <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="10" da
ta-offset-y="20" data-expected-width="50" data-expected-height="30">XXXXX XXXXXX
</div> | 83 <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="10" da
ta-offset-y="20" data-expected-width="50" data-expected-height="30">XXXXX XXXXXX
</div> |
84 </div> | 84 </div> |
85 </div> | 85 </div> |
86 | 86 |
87 <div id="test-output"></div> | 87 <div id="test-output"></div> |
88 | 88 |
89 </body> | 89 </body> |
90 </html> | 90 </html> |
OLD | NEW |