OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <script> | 3 <script> |
4 if (window.testRunner) | 4 if (window.testRunner) |
5 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); | 5 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); |
6 </script> | 6 </script> |
7 <link href="resources/grid.css" rel="stylesheet"> | 7 <link href="resources/grid.css" rel="stylesheet"> |
8 <style> | 8 <style> |
9 .columnGrid { | 9 .columnGrid { |
10 grid-definition-columns: 50px 100px; | 10 grid-template-columns: 50px 100px; |
11 /* grid-definition-rows is left unset so that the grid items' row is implici
t. */ | 11 /* grid-template-rows is left unset so that the grid items' row is implicit.
*/ |
12 font: 10px/1 Ahem; | 12 font: 10px/1 Ahem; |
13 } | 13 } |
14 | 14 |
15 .rowGrid { | 15 .rowGrid { |
16 grid-definition-rows: 50px 100px; | 16 grid-template-rows: 50px 100px; |
17 /* grid-definition-columns is left unset so that the grid items' column is i
mplicit. */ | 17 /* grid-template-columns is left unset so that the grid items' column is imp
licit. */ |
18 font: 10px/1 Ahem; | 18 font: 10px/1 Ahem; |
19 } | 19 } |
20 </style> | 20 </style> |
21 <script src="../../resources/check-layout.js"></script> | 21 <script src="../../resources/check-layout.js"></script> |
22 <body onload="checkLayout('.grid');"> | 22 <body onload="checkLayout('.grid');"> |
23 | 23 |
24 <p>Test that negative <integer> positions are resolved against the explici
t grid (that is don't account for implicit columns and rows).</p> | 24 <p>Test that negative <integer> positions are resolved against the explici
t grid (that is don't account for implicit columns and rows).</p> |
25 | 25 |
26 <div class="constrainedContainer"> | 26 <div class="constrainedContainer"> |
27 <div class="grid columnGrid"> | 27 <div class="grid columnGrid"> |
(...skipping 18 matching lines...) Expand all Loading... |
46 | 46 |
47 <div class="constrainedContainer"> | 47 <div class="constrainedContainer"> |
48 <div class="grid rowGrid"> | 48 <div class="grid rowGrid"> |
49 <div class="sizedToGridArea thirdRowAutoColumn" data-expected-width="60"
data-expected-height="30">XXXXXX XXXXX XXXXX</div> | 49 <div class="sizedToGridArea thirdRowAutoColumn" data-expected-width="60"
data-expected-height="30">XXXXXX XXXXX XXXXX</div> |
50 <div class="sizedToGridArea autoLastRowAutoLastColumn" data-expected-wid
th="60" data-expected-height="100"></div> | 50 <div class="sizedToGridArea autoLastRowAutoLastColumn" data-expected-wid
th="60" data-expected-height="100"></div> |
51 </div> | 51 </div> |
52 </div> | 52 </div> |
53 | 53 |
54 </body> | 54 </body> |
55 </html> | 55 </html> |
OLD | NEW |