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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-percentage-columns.html

Issue 2033033002: [css-grid] Percentage columns can always be resolved during layout (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Minor fixes on tests Created 4 years, 6 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
« no previous file with comments | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/named-grid-line-get-set.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet">
3 <link href="resources/grid.css" rel="stylesheet">
4 <style>
5 .wrapper {
6 position: relative;
7 clear: both;
8 }
9
10 .grid {
11 font: 10px/1 Ahem;
12 }
13
14 .float {
15 float: left;
16 }
17
18 .abspos {
19 position: absolute;
20 }
21
22 .fixedSize {
23 width: 200px;
24 height: 200px;
25 }
26
27 .oneColumn100 {
28 grid-template-columns: 100%;
29 }
30
31 .oneColumn50 {
32 grid-template-columns: 50%;
33 }
34
35 .twoColumns {
36 grid-template-columns: 50% 100px;
37 }
38 </style>
39 <script src="../../resources/testharness.js"></script>
40 <script src="../../resources/testharnessreport.js"></script>
41 <script src="../../resources/check-layout-th.js"></script>
42 <body onload="checkLayout('.grid')">
43 <div id="log"></div>
44
45 <p>This test checks that percentage columns are only indefinite during intrinsic size computation. Aftewards, they are properly resolved against the grid contai ner intrinsic sizes.</p>
46
47 <div class="wrapper">
48 <div class="grid float oneColumn100" data-expected-width="40" data-expected- height="10">
49 <div class="firstRowFirstColumn"
50 data-offset-x="0" data-offset-y="0" data-expected-width="40" data-ex pected-height="10">
51 XX X
52 </div>
53 </div>
54 </div>
55
56 <div class="wrapper">
57 <div class="grid abspos oneColumn100" data-expected-width="40" data-expected -height="10">
58 <div class="firstRowFirstColumn"
59 data-offset-x="0" data-offset-y="0" data-expected-width="40" data-ex pected-height="10">
60 XX X
61 </div>
62 </div>
63 </div>
64
65 <div class="wrapper">
66 <div class="grid max-content oneColumn100" data-expected-width="40" data-exp ected-height="10">
67 <div class="firstRowFirstColumn"
68 data-offset-x="0" data-offset-y="0" data-expected-width="40" data-ex pected-height="10">
69 XX X
70 </div>
71 </div>
72 </div>
73
74 <div class="wrapper">
75 <div class="grid fit-content oneColumn100" data-expected-width="40" data-exp ected-height="10">
76 <div class="firstRowFirstColumn"
77 data-offset-x="0" data-offset-y="0" data-expected-width="40" data-ex pected-height="10">
78 XX X
79 </div>
80 </div>
81 </div>
82
83 <div class="wrapper">
84 <div class="grid min-content oneColumn100" data-expected-width="20" data-exp ected-height="20">
85 <div class="firstRowFirstColumn"
86 data-offset-x="0" data-offset-y="0" data-expected-width="20" data-ex pected-height="20">
87 XX X
88 </div>
89 </div>
90 </div>
91
92 <div class="wrapper">
93 <div class="grid float oneColumn50" data-expected-width="40" data-expected-h eight="20">
94 <div class="firstRowFirstColumn"
95 data-offset-x="0" data-offset-y="0" data-expected-width="20" data-ex pected-height="20">
96 XX X
97 </div>
98 </div>
99 </div>
100
101 <div class="wrapper">
102 <div class="grid abspos oneColumn50" data-expected-width="40" data-expected- height="20">
103 <div class="firstRowFirstColumn"
104 data-offset-x="0" data-offset-y="0" data-expected-width="20" data-ex pected-height="20">
105 XX X
106 </div>
107 </div>
108 </div>
109
110 <div class="wrapper">
111 <div class="grid max-content oneColumn50" data-expected-width="40" data-expe cted-height="20">
112 <div class="firstRowFirstColumn"
113 data-offset-x="0" data-offset-y="0" data-expected-width="20" data-ex pected-height="20">
114 XX X
115 </div>
116 </div>
117 </div>
118
119 <div class="wrapper">
120 <div class="grid fit-content oneColumn50" data-expected-width="40" data-expe cted-height="20">
121 <div class="firstRowFirstColumn"
122 data-offset-x="0" data-offset-y="0" data-expected-width="20" data-ex pected-height="20">
123 XX X
124 </div>
125 </div>
126 </div>
127
128 <div class="wrapper">
129 <div class="grid min-content oneColumn50" data-expected-width="20" data-expe cted-height="20">
130 <div class="firstRowFirstColumn"
131 data-offset-x="0" data-offset-y="0" data-expected-width="20" data-ex pected-height="20">
132 XX X
133 </div>
134 </div>
135 </div>
136
137 <div class="wrapper">
138 <div class="grid float twoColumns" data-expected-width="140" data-expected-h eight="10">
139 <div class="firstRowFirstColumn"
140 data-offset-x="0" data-offset-y="0" data-expected-width="70" data-ex pected-height="10">
141 XX X
142 </div>
143 <div class="firstRowSecondColumn"
144 data-offset-x="70" data-offset-y="0" data-expected-width="100" data- expected-height="10">
145 </div>
146 </div>
147 </div>
148
149 <div class="wrapper">
150 <div class="grid abspos twoColumns" data-expected-width="140" data-expected- height="10">
151 <div class="firstRowFirstColumn"
152 data-offset-x="0" data-offset-y="0" data-expected-width="70" data-ex pected-height="10">
153 XX X
154 </div>
155 <div class="firstRowSecondColumn"
156 data-offset-x="70" data-offset-y="0" data-expected-width="100" data- expected-height="10">
157 </div>
158 </div>
159 </div>
160
161 <div class="wrapper">
162 <div class="grid max-content twoColumns" data-expected-width="140" data-expe cted-height="10">
163 <div class="firstRowFirstColumn"
164 data-offset-x="0" data-offset-y="0" data-expected-width="70" data-ex pected-height="10">
165 XX X
166 </div>
167 <div class="firstRowSecondColumn"
168 data-offset-x="70" data-offset-y="0" data-expected-width="100" data- expected-height="10">
169 </div>
170 </div>
171 </div>
172
173 <div class="wrapper">
174 <div class="grid fit-content twoColumns" data-expected-width="140" data-expe cted-height="10">
175 <div class="firstRowFirstColumn"
176 data-offset-x="0" data-offset-y="0" data-expected-width="70" data-ex pected-height="10">
177 XX X
178 </div>
179 <div class="firstRowSecondColumn"
180 data-offset-x="70" data-offset-y="0" data-expected-width="100" data- expected-height="10">
181 </div>
182 </div>
183 </div>
184
185 <div class="wrapper">
186 <div class="grid min-content twoColumns" data-expected-width="120" data-expe cted-height="10">
187 <div class="firstRowFirstColumn"
188 data-offset-x="0" data-offset-y="0" data-expected-width="60" data-ex pected-height="10">
189 XX X
190 </div>
191 <div class="firstRowSecondColumn"
192 data-offset-x="60" data-offset-y="0" data-expected-width="100" data- expected-height="10">
193 </div>
194 </div>
195 </div>
196
197 <div class="wrapper">
198 <div class="grid float twoColumns" data-expected-width="100" data-expected-h eight="10">
199 <div class="firstRowFirstColumn"
200 data-offset-x="0" data-offset-y="0" data-expected-width="50" data-ex pected-height="10">
201 </div>
202 <div class="firstRowSecondColumn"
203 data-offset-x="50" data-offset-y="0" data-expected-width="100" data- expected-height="10">
204 XX X
205 </div>
206 </div>
207 </div>
208
209 <div class="wrapper">
210 <div class="grid abspos twoColumns" data-expected-width="100" data-expected- height="10">
211 <div class="firstRowFirstColumn"
212 data-offset-x="0" data-offset-y="0" data-expected-width="50" data-ex pected-height="10">
213 </div>
214 <div class="firstRowSecondColumn"
215 data-offset-x="50" data-offset-y="0" data-expected-width="100" data- expected-height="10">
216 XX X
217 </div>
218 </div>
219 </div>
220
221 <div class="wrapper">
222 <div class="grid max-content twoColumns" data-expected-width="100" data-expe cted-height="10">
223 <div class="firstRowFirstColumn"
224 data-offset-x="0" data-offset-y="0" data-expected-width="50" data-ex pected-height="10">
225 </div>
226 <div class="firstRowSecondColumn"
227 data-offset-x="50" data-offset-y="0" data-expected-width="100" data- expected-height="10">
228 XX X
229 </div>
230 </div>
231 </div>
232
233 <div class="wrapper">
234 <div class="grid min-content twoColumns" data-expected-width="100" data-expe cted-height="10">
235 <div class="firstRowFirstColumn"
236 data-offset-x="0" data-offset-y="0" data-expected-width="50" data-ex pected-height="10">
237 </div>
238 <div class="firstRowSecondColumn"
239 data-offset-x="50" data-offset-y="0" data-expected-width="100" data- expected-height="10">
240 XX X
241 </div>
242 </div>
243 </div>
244
245 <div class="wrapper">
246 <div class="grid fit-content twoColumns" data-expected-width="100" data-expe cted-height="10">
247 <div class="firstRowFirstColumn"
248 data-offset-x="0" data-offset-y="0" data-expected-width="50" data-ex pected-height="10">
249 </div>
250 <div class="firstRowSecondColumn"
251 data-offset-x="50" data-offset-y="0" data-expected-width="100" data- expected-height="10">
252 XX X
253 </div>
254 </div>
255 </div>
256
257 </body>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/named-grid-line-get-set.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698