OLD | NEW |
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> | 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
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 .singleSingleTrackRepeat { | 6 .singleSingleTrackRepeat { |
7 grid-definition-rows: repeat(1, 18px); | 7 grid-definition-rows: repeat(1, 18px); |
8 grid-definition-columns: repeat(1, 15%); | 8 grid-definition-columns: repeat(1, 15%); |
9 } | 9 } |
10 | 10 |
11 .twoSingleTrackRepeat { | 11 .twoSingleTrackRepeat { |
12 grid-definition-rows: repeat(2, auto); | 12 grid-definition-rows: repeat(2, auto); |
13 grid-definition-columns: repeat(2, minmax(15px, 50%)); | 13 grid-definition-columns: repeat(2, minmax(15px, 50%)); |
14 } | 14 } |
15 | 15 |
16 .twoDoubleTrackRepeat { | 16 .twoDoubleTrackRepeat { |
17 grid-definition-rows: repeat(2, minmax(5px, 10px) auto); | 17 grid-definition-rows: repeat(2, minmax(5px, 10px) auto); |
18 grid-definition-columns: repeat(2, auto minmax(100px, 120px)); | 18 grid-definition-columns: repeat(2, auto minmax(100px, 120px)); |
19 } | 19 } |
20 | 20 |
21 .twoDoubleTrackWithNamedGridLineRepeat { | 21 .twoDoubleTrackWithNamedGridLineRepeat { |
22 grid-definition-rows: repeat(2, 10px 'start' auto 'end'); | 22 grid-definition-rows: repeat(2, 10px (start) auto (end)); |
23 grid-definition-columns: repeat(2, auto 'middle' 250px 'end'); | 23 grid-definition-columns: repeat(2, auto (middle) 250px (end)); |
24 } | 24 } |
25 | 25 |
26 .twoDoubleTrackWithTrailingNamedGridLineRepeat { | 26 .twoDoubleTrackWithTrailingNamedGridLineRepeat { |
27 grid-definition-rows: repeat(2, 'before' 10px); | 27 grid-definition-rows: repeat(2, (before) 10px); |
28 grid-definition-columns: repeat(2, 'before' auto); | 28 grid-definition-columns: repeat(2, (before) auto); |
29 } | 29 } |
30 | 30 |
31 .trailingNamedGridLineRepeat { | 31 .trailingNamedGridLineRepeat { |
32 grid-definition-rows: repeat(1, 10px) 'end'; | 32 grid-definition-rows: repeat(1, 10px) (end); |
33 grid-definition-columns: repeat(1, 250px) 'end'; | 33 grid-definition-columns: repeat(1, 250px) (end); |
34 } | 34 } |
35 | 35 |
36 .leadingNamedGridLineRepeat { | 36 .leadingNamedGridLineRepeat { |
37 grid-definition-rows: 'start' repeat(2, 10px); | 37 grid-definition-rows: (start) repeat(2, 10px); |
38 grid-definition-columns: 'start' repeat(2, 250px); | 38 grid-definition-columns: (start) repeat(2, 250px); |
39 } | 39 } |
40 | 40 |
41 .mixRepeatAfterNonRepeat { | 41 .mixRepeatAfterNonRepeat { |
42 grid-definition-rows: auto repeat(2, 10px); | 42 grid-definition-rows: auto repeat(2, 10px); |
43 grid-definition-columns: 'start' 140px repeat(2, 250px); | 43 grid-definition-columns: (start) 140px repeat(2, 250px); |
44 } | 44 } |
45 | 45 |
46 .mixNonRepeatAfterRepeat { | 46 .mixNonRepeatAfterRepeat { |
47 grid-definition-rows: repeat(2, 10px) 'end' auto; | 47 grid-definition-rows: repeat(2, 10px) (end) auto; |
48 grid-definition-columns: repeat(2, 250px) 15% 'last'; | 48 grid-definition-columns: repeat(2, 250px) 15% (last); |
49 } | 49 } |
50 </style> | 50 </style> |
51 <script src="../../resources/js-test.js"></script> | 51 <script src="../../resources/js-test.js"></script> |
52 </head> | 52 </head> |
53 <body> | 53 <body> |
54 <div class="singleSingleTrackRepeat" id="singleSingleTrackRepeat"></div> | 54 <div class="singleSingleTrackRepeat" id="singleSingleTrackRepeat"></div> |
55 <div class="twoSingleTrackRepeat" id="twoSingleTrackRepeat"></div> | 55 <div class="twoSingleTrackRepeat" id="twoSingleTrackRepeat"></div> |
56 <div class="twoDoubleTrackRepeat" id="twoDoubleTrackRepeat"></div> | 56 <div class="twoDoubleTrackRepeat" id="twoDoubleTrackRepeat"></div> |
57 <div class="twoDoubleTrackWithNamedGridLineRepeat" id="twoDoubleTrackWithNamedGr
idLineRepeat"></div> | 57 <div class="twoDoubleTrackWithNamedGridLineRepeat" id="twoDoubleTrackWithNamedGr
idLineRepeat"></div> |
58 <div class="twoDoubleTrackWithTrailingNamedGridLineRepeat" id="twoDoubleTrackWit
hTrailingNamedGridLineRepeat"></div> | 58 <div class="twoDoubleTrackWithTrailingNamedGridLineRepeat" id="twoDoubleTrackWit
hTrailingNamedGridLineRepeat"></div> |
(...skipping 31 matching lines...) Loading... |
90 testInvalidSyntax("repeat(3 / auto)"); | 90 testInvalidSyntax("repeat(3 / auto)"); |
91 testInvalidSyntax("repeat(3 , ,)"); | 91 testInvalidSyntax("repeat(3 , ,)"); |
92 testInvalidSyntax("repeat(0, 15px)"); | 92 testInvalidSyntax("repeat(0, 15px)"); |
93 testInvalidSyntax("repeat(-1, auto)"); | 93 testInvalidSyntax("repeat(-1, auto)"); |
94 // Nesting is no allowed. | 94 // Nesting is no allowed. |
95 testInvalidSyntax("repeat(2, repeat(1, auto))"); | 95 testInvalidSyntax("repeat(2, repeat(1, auto))"); |
96 </script> | 96 </script> |
97 <script src="../js/resources/js-test-post.js"></script> | 97 <script src="../js/resources/js-test-post.js"></script> |
98 </body> | 98 </body> |
99 </html> | 99 </html> |
OLD | NEW |