Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(438)

Side by Side Diff: LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html

Issue 146773002: [CSS Grid Layout] Rename grid-definition-{columns|rows} to match the new syntax (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Fixed renaming issues with some tests. Created 6 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <script> 4 <script>
5 if (window.testRunner) 5 if (window.testRunner)
6 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); 6 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1);
7 </script> 7 </script>
8 <link href="resources/grid.css" rel="stylesheet"> 8 <link href="resources/grid.css" rel="stylesheet">
9 <style> 9 <style>
10 .grid { 10 .grid {
(...skipping 10 matching lines...) Expand all
21 } 21 }
22 22
23 .gridItem2 { 23 .gridItem2 {
24 grid-column: 2; 24 grid-column: 2;
25 grid-row: 2; 25 grid-row: 2;
26 width: 17px; 26 width: 17px;
27 height: 3px; 27 height: 3px;
28 } 28 }
29 29
30 .gridWithFixed { 30 .gridWithFixed {
31 grid-definition-columns: 7px 11px; 31 grid-template-columns: 7px 11px;
32 grid-definition-rows: 17px 2px; 32 grid-template-rows: 17px 2px;
33 } 33 }
34 34
35 .gridWithPercent { 35 .gridWithPercent {
36 grid-definition-columns: 53% 99%; 36 grid-template-columns: 53% 99%;
37 grid-definition-rows: 27% 52%; 37 grid-template-rows: 27% 52%;
38 } 38 }
39 .gridWithAuto { 39 .gridWithAuto {
40 grid-definition-columns: auto auto; 40 grid-template-columns: auto auto;
41 grid-definition-rows: auto auto; 41 grid-template-rows: auto auto;
42 } 42 }
43 .gridWithEM { 43 .gridWithEM {
44 grid-definition-columns: 10em 12em; 44 grid-template-columns: 10em 12em;
45 grid-definition-rows: 15em 17em; 45 grid-template-rows: 15em 17em;
46 font: 10px Ahem; 46 font: 10px Ahem;
47 } 47 }
48 .gridWithNoneAndAuto { 48 .gridWithNoneAndAuto {
49 grid-definition-columns: none auto; 49 grid-template-columns: none auto;
50 grid-definition-rows: none auto; 50 grid-template-rows: none auto;
51 } 51 }
52 .gridNoneWithAndFixed { 52 .gridNoneWithAndFixed {
53 grid-definition-columns: none 15px; 53 grid-template-columns: none 15px;
54 grid-definition-rows: none 22px; 54 grid-template-rows: none 22px;
55 } 55 }
56 .gridWithThreeItems { 56 .gridWithThreeItems {
57 grid-definition-columns: 15px auto 10em; 57 grid-template-columns: 15px auto 10em;
58 grid-definition-rows: 12em 18px auto; 58 grid-template-rows: 12em 18px auto;
59 font: 10px Ahem; 59 font: 10px Ahem;
60 } 60 }
61 .gridWithPercentAndViewportPercent { 61 .gridWithPercentAndViewportPercent {
62 grid-definition-columns: 50% 15vw; 62 grid-template-columns: 50% 15vw;
63 grid-definition-rows: 35% 28vh; 63 grid-template-rows: 35% 28vh;
64 } 64 }
65 .gridWithFitContentAndFitAvailable { 65 .gridWithFitContentAndFitAvailable {
66 grid-definition-columns: -webkit-content-available; 66 grid-template-columns: -webkit-content-available;
67 grid-definition-rows: -webkit-fit-content -webkit-fit-available; 67 grid-template-rows: -webkit-fit-content -webkit-fit-available;
68 } 68 }
69 .gridWithMinMaxContent { 69 .gridWithMinMaxContent {
70 grid-definition-columns: min-content max-content; 70 grid-template-columns: min-content max-content;
71 grid-definition-rows: max-content min-content; 71 grid-template-rows: max-content min-content;
72 } 72 }
73 .gridWithMinMaxAndFixed { 73 .gridWithMinMaxAndFixed {
74 grid-definition-columns: minmax(45px, 30%) 15px; 74 grid-template-columns: minmax(45px, 30%) 15px;
75 grid-definition-rows: 12em minmax(35%, 10px); 75 grid-template-rows: 12em minmax(35%, 10px);
76 font: 10px Ahem; 76 font: 10px Ahem;
77 } 77 }
78 .gridWithMinMaxAndMinMaxContent { 78 .gridWithMinMaxAndMinMaxContent {
79 grid-definition-columns: minmax(min-content, 30%) 15px; 79 grid-template-columns: minmax(min-content, 30%) 15px;
80 grid-definition-rows: 12em minmax(35%, max-content); 80 grid-template-rows: 12em minmax(35%, max-content);
81 font: 10px Ahem; 81 font: 10px Ahem;
82 } 82 }
83 .gridWithFractionFraction { 83 .gridWithFractionFraction {
84 grid-definition-columns: 2fr 3fr; 84 grid-template-columns: 2fr 3fr;
85 grid-definition-rows: 3fr 5fr; 85 grid-template-rows: 3fr 5fr;
86 } 86 }
87 .gridWithFractionMinMax { 87 .gridWithFractionMinMax {
88 grid-definition-columns: minmax(min-content, 45px) 2fr; 88 grid-template-columns: minmax(min-content, 45px) 2fr;
89 grid-definition-rows: 3fr minmax(14px, max-content); 89 grid-template-rows: 3fr minmax(14px, max-content);
90 } 90 }
91 .gridWithCalcCalc { 91 .gridWithCalcCalc {
92 grid-definition-columns: calc(200px) calc(10em); 92 grid-template-columns: calc(200px) calc(10em);
93 grid-definition-rows: calc(15em) calc(75px); 93 grid-template-rows: calc(15em) calc(75px);
94 font: 10px Ahem; 94 font: 10px Ahem;
95 } 95 }
96 .gridWithCalcAndFixed { 96 .gridWithCalcAndFixed {
97 grid-definition-columns: calc(50%) 8em; 97 grid-template-columns: calc(50%) 8em;
98 grid-definition-rows: 88px calc(25%); 98 grid-template-rows: 88px calc(25%);
99 font: 10px Ahem; 99 font: 10px Ahem;
100 } 100 }
101 .gridWithCalcAndMinMax { 101 .gridWithCalcAndMinMax {
102 grid-definition-columns: calc(30px + 20%) minmax(min-content, 80px); 102 grid-template-columns: calc(30px + 20%) minmax(min-content, 80px);
103 grid-definition-rows: minmax(25%, max-content) calc(10% - 7px); 103 grid-template-rows: minmax(25%, max-content) calc(10% - 7px);
104 } 104 }
105 .gridWithCalcInsideMinMax { 105 .gridWithCalcInsideMinMax {
106 grid-definition-columns: minmax(calc(23px + 10%), 400px) 12em; 106 grid-template-columns: minmax(calc(23px + 10%), 400px) 12em;
107 grid-definition-rows: calc(150px) minmax(5%, calc(50% - 125px)); 107 grid-template-rows: calc(150px) minmax(5%, calc(50% - 125px));
108 font: 10px Ahem; 108 font: 10px Ahem;
109 } 109 }
110 </style> 110 </style>
111 <script src="../../resources/js-test.js"></script> 111 <script src="../../resources/js-test.js"></script>
112 </head> 112 </head>
113 <body> 113 <body>
114 <div class="grid gridWithFixed" id="gridWithFixedElement"></div> 114 <div class="grid gridWithFixed" id="gridWithFixedElement"></div>
115 <div class="grid gridWithPercent" id="gridWithPercentElement"></div> 115 <div class="grid gridWithPercent" id="gridWithPercentElement"></div>
116 <div class="indefiniteSizeGrid gridWithPercent" id="gridWithPercentWithoutSize"> 116 <div class="indefiniteSizeGrid gridWithPercent" id="gridWithPercentWithoutSize">
117 <div class="gridItem"></div> 117 <div class="gridItem"></div>
(...skipping 17 matching lines...) Expand all
135 <div class="grid gridWithFractionFraction" id="gridWithFractionFraction"></div> 135 <div class="grid gridWithFractionFraction" id="gridWithFractionFraction"></div>
136 <div class="grid gridWithFractionMinMax" id="gridWithFractionMinMax"></div> 136 <div class="grid gridWithFractionMinMax" id="gridWithFractionMinMax"></div>
137 <div class="grid gridWithCalcCalc" id="gridWithCalcCalc"></div> 137 <div class="grid gridWithCalcCalc" id="gridWithCalcCalc"></div>
138 <div class="grid gridWithCalcAndFixed" id="gridWithCalcAndFixed"></div> 138 <div class="grid gridWithCalcAndFixed" id="gridWithCalcAndFixed"></div>
139 <div class="grid gridWithCalcAndMinMax" id="gridWithCalcAndMinMax"></div> 139 <div class="grid gridWithCalcAndMinMax" id="gridWithCalcAndMinMax"></div>
140 <div class="grid gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMax"></div> 140 <div class="grid gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMax"></div>
141 <script src="resources/grid-definitions-parsing-utils.js"></script> 141 <script src="resources/grid-definitions-parsing-utils.js"></script>
142 <script src="resources/grid-columns-rows-get-set-multiple.js"></script> 142 <script src="resources/grid-columns-rows-get-set-multiple.js"></script>
143 </body> 143 </body>
144 </html> 144 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698