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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/css3/flexbox/line-wrapping.html

Issue 1088633002: Unprefix flexbox tests. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 5 years, 8 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 | Annotate | Revision Log
« LayoutTests/css3/flexbox/anonymous-block-merge-crash.html ('K') | « LayoutTests/css3/flexbox/intrinsic-min-width-applies-with-fixed-width.html ('k') | LayoutTests/css3/flexbox/multiline.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <style> 3 <style>
4 body { 4 body {
5 width: 500px; 5 width: 500px;
6 height: 500px; 6 height: 500px;
7 margin: 0; 7 margin: 0;
8 border: 1px solid; 8 border: 1px solid;
9 } 9 }
10 .column { 10 .column {
11 -webkit-flex-flow: column; 11 flex-flow: column;
12 } 12 }
13 .flexbox { 13 .flexbox {
14 display: -webkit-flex; 14 display: flex;
15 background-color: gray; 15 background-color: gray;
16 position: relative; 16 position: relative;
17 } 17 }
18 .flexbox > div { 18 .flexbox > div {
19 line-height: 0px; 19 line-height: 0px;
20 } 20 }
21 .flexbox > div > div { 21 .flexbox > div > div {
22 display: inline-block; 22 display: inline-block;
23 line-height: 0px; 23 line-height: 0px;
24 } 24 }
(...skipping 10 matching lines...) Expand all
35 } 35 }
36 36
37 .horizontal-tb.row, .horizontal-tb.fixed.column { 37 .horizontal-tb.row, .horizontal-tb.fixed.column {
38 height: 100px; 38 height: 100px;
39 } 39 }
40 .vertical-lr.row, .vertical-rl.row, .vertical-lr.fixed.column, .vertical-rl.fixe d.column { 40 .vertical-lr.row, .vertical-rl.row, .vertical-lr.fixed.column, .vertical-rl.fixe d.column {
41 width: 100px; 41 width: 100px;
42 } 42 }
43 43
44 .horizontal-tb.row > div { 44 .horizontal-tb.row > div {
45 -webkit-flex: 1; 45 flex: 1;
46 } 46 }
47 .vertical-lr.row > div, .vertical-rl.row > div { 47 .vertical-lr.row > div, .vertical-rl.row > div {
48 -webkit-flex: 1; 48 flex: 1;
49 } 49 }
50 50
51 .horizontal-tb.column > div { 51 .horizontal-tb.column > div {
52 -webkit-flex: 1 auto; 52 flex: 1 auto;
53 } 53 }
54 .vertical-lr.column > div, .vertical-rl.column > div { 54 .vertical-lr.column > div, .vertical-rl.column > div {
55 -webkit-flex: 1 auto; 55 flex: 1 auto;
56 } 56 }
57 57
58 .horizontal-tb.fixed { 58 .horizontal-tb.fixed {
59 width: 200px; 59 width: 200px;
60 } 60 }
61 .vertical-lr.fixed, .vertical-rl.fixed { 61 .vertical-lr.fixed, .vertical-rl.fixed {
62 height: 200px; 62 height: 200px;
63 } 63 }
64 64
65 .horizontal-tb.flexbox > div > div { 65 .horizontal-tb.flexbox > div > div {
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after
108 background-color: orange; 108 background-color: orange;
109 } 109 }
110 </style> 110 </style>
111 <script src="../../resources/check-layout.js"></script> 111 <script src="../../resources/check-layout.js"></script>
112 <body onload="checkLayout('.flexbox')"> 112 <body onload="checkLayout('.flexbox')">
113 113
114 <div class="flexbox fixed row horizontal-tb"> 114 <div class="flexbox fixed row horizontal-tb">
115 <div data-expected-width=100 data-expected-height=100> 115 <div data-expected-width=100 data-expected-height=100>
116 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=0></div> 116 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=0></div>
117 </div> 117 </div>
118 <div data-expected-width=100 data-expected-height=40 style="-webkit-align-se lf: flex-start;"> 118 <div data-expected-width=100 data-expected-height=40 style="align-self: flex -start;">
119 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=100></div> 119 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=100></div>
120 </div> 120 </div>
121 </div> 121 </div>
122 122
123 <div class="flexbox fixed column horizontal-tb"> 123 <div class="flexbox fixed column horizontal-tb">
124 <div data-expected-width=200 data-expected-height=50> 124 <div data-expected-width=200 data-expected-height=50>
125 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset- y=20 data-offset-x=0></div> 125 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset- y=20 data-offset-x=0></div>
126 </div> 126 </div>
127 <div data-expected-width=200 data-expected-height=50 style="-webkit-align-se lf: flex-start;"> 127 <div data-expected-width=200 data-expected-height=50 style="align-self: flex -start;">
128 <div data-offset-y=50></div><div data-offset-y=50></div><div data-offset -y=50></div><div data-offset-y=50></div><div data-offset-y=50></div><div data-of fset-y=70 data-offset-x=0></div> 128 <div data-offset-y=50></div><div data-offset-y=50></div><div data-offset -y=50></div><div data-offset-y=50></div><div data-offset-y=50></div><div data-of fset-y=70 data-offset-x=0></div>
129 </div> 129 </div>
130 </div> 130 </div>
131 131
132 <div class="flexbox fixed column horizontal-tb"> 132 <div class="flexbox fixed column horizontal-tb">
133 <div data-expected-width=200 data-expected-height=50> 133 <div data-expected-width=200 data-expected-height=50>
134 <div data-offset-y=0></div><div data-offset-y=0></div> 134 <div data-offset-y=0></div><div data-offset-y=0></div>
135 </div> 135 </div>
136 <div data-expected-width=80 data-expected-height=50 style="-webkit-align-sel f: flex-start;"> 136 <div data-expected-width=80 data-expected-height=50 style="align-self: flex- start;">
137 <div data-offset-y=50></div><div data-offset-y=50></div> 137 <div data-offset-y=50></div><div data-offset-y=50></div>
138 </div> 138 </div>
139 </div> 139 </div>
140 140
141 <div class="flexbox auto row horizontal-tb" data-expected-width=500> 141 <div class="flexbox auto row horizontal-tb" data-expected-width=500>
142 <div data-expected-width=250 data-expected-height=100> 142 <div data-expected-width=250 data-expected-height=100>
143 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=0></div> 143 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=0></div>
144 </div> 144 </div>
145 <div data-expected-width=250 data-expected-height=40 style="-webkit-align-se lf: flex-start;"> 145 <div data-expected-width=250 data-expected-height=40 style="align-self: flex -start;">
146 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=250></div> 146 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =20 data-offset-x=250></div>
147 </div> 147 </div>
148 </div> 148 </div>
149 149
150 <div data-expected-width=500 data-expected-height=80 class="flexbox auto column horizontal-tb"> 150 <div data-expected-width=500 data-expected-height=80 class="flexbox auto column horizontal-tb">
151 <div data-expected-width=500 data-expected-height=40> 151 <div data-expected-width=500 data-expected-height=40>
152 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset- y=20 data-offset-x=0></div> 152 <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y =0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset- y=20 data-offset-x=0></div>
153 </div> 153 </div>
154 <div data-expected-width=500 data-expected-height=40 style="-webkit-align-se lf: flex-start;"> 154 <div data-expected-width=500 data-expected-height=40 style="align-self: flex -start;">
155 <div data-offset-y=40></div><div data-offset-y=40></div><div data-offset -y=40></div><div data-offset-y=40></div><div data-offset-y=40></div><div data-of fset-y=60 data-offset-x=0></div> 155 <div data-offset-y=40></div><div data-offset-y=40></div><div data-offset -y=40></div><div data-offset-y=40></div><div data-offset-y=40></div><div data-of fset-y=60 data-offset-x=0></div>
156 </div> 156 </div>
157 </div> 157 </div>
158 158
159 <!-- FIXME: All the vertical-lr cases are off by 4px in the x direction. See htt p://webkit.org/b/71193. --> 159 <!-- FIXME: All the vertical-lr cases are off by 4px in the x direction. See htt p://webkit.org/b/71193. -->
160 160
161 <div class="flexbox fixed row vertical-lr"> 161 <div class="flexbox fixed row vertical-lr">
162 <div data-expected-height data-expected-width=100> 162 <div data-expected-height data-expected-width=100>
163 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=0></div> 163 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=0></div>
164 </div> 164 </div>
165 <div data-expected-height=100 data-expected-width=40 style="-webkit-align-se lf: flex-start;"> 165 <div data-expected-height=100 data-expected-width=40 style="align-self: flex -start;">
166 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=100></div> 166 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=100></div>
167 </div> 167 </div>
168 </div> 168 </div>
169 169
170 <div class="flexbox fixed column vertical-lr"> 170 <div class="flexbox fixed column vertical-lr">
171 <div data-expected-height=200 data-expected-width=50> 171 <div data-expected-height=200 data-expected-width=50>
172 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset- x=24 data-offset-y=0></div> 172 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset- x=24 data-offset-y=0></div>
173 </div> 173 </div>
174 <div data-expected-height=200 data-expected-width=50 style="-webkit-align-se lf: flex-start;"> 174 <div data-expected-height=200 data-expected-width=50 style="align-self: flex -start;">
175 <div data-offset-x=54></div><div data-offset-x=54></div><div data-offset -x=54></div><div data-offset-x=54></div><div data-offset-x=54></div><div data-of fset-x=74 data-offset-y=0></div> 175 <div data-offset-x=54></div><div data-offset-x=54></div><div data-offset -x=54></div><div data-offset-x=54></div><div data-offset-x=54></div><div data-of fset-x=74 data-offset-y=0></div>
176 </div> 176 </div>
177 </div> 177 </div>
178 178
179 <div class="flexbox fixed column vertical-lr"> 179 <div class="flexbox fixed column vertical-lr">
180 <div data-expected-height=200 data-expected-width=50> 180 <div data-expected-height=200 data-expected-width=50>
181 <div data-offset-x=4></div><div data-offset-x=4></div> 181 <div data-offset-x=4></div><div data-offset-x=4></div>
182 </div> 182 </div>
183 <div data-expected-height=80 data-expected-width=50 style="-webkit-align-sel f: flex-start;"> 183 <div data-expected-height=80 data-expected-width=50 style="align-self: flex- start;">
184 <div data-offset-x=54></div><div data-offset-x=54></div> 184 <div data-offset-x=54></div><div data-offset-x=54></div>
185 </div> 185 </div>
186 </div> 186 </div>
187 187
188 <div class="flexbox auto row vertical-lr" data-expected-height=500> 188 <div class="flexbox auto row vertical-lr" data-expected-height=500>
189 <div data-expected-height=250 data-expected-width=100> 189 <div data-expected-height=250 data-expected-width=100>
190 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=0></div> 190 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=0></div>
191 </div> 191 </div>
192 <div data-expected-height=250 data-expected-width=40 style="-webkit-align-se lf: flex-start;"> 192 <div data-expected-height=250 data-expected-width=40 style="align-self: flex -start;">
193 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=250></div> 193 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =24 data-offset-y=250></div>
194 </div> 194 </div>
195 </div> 195 </div>
196 196
197 <div data-expected-height=500 data-expected-width=80 class="flexbox auto column vertical-lr"> 197 <div data-expected-height=500 data-expected-width=80 class="flexbox auto column vertical-lr">
198 <div data-expected-height=500 data-expected-width=40> 198 <div data-expected-height=500 data-expected-width=40>
199 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset- x=24 data-offset-y=0></div> 199 <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x =4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset- x=24 data-offset-y=0></div>
200 </div> 200 </div>
201 <div data-expected-height=500 data-expected-width=40 style="-webkit-align-se lf: flex-start;"> 201 <div data-expected-height=500 data-expected-width=40 style="align-self: flex -start;">
202 <div data-offset-x=44></div><div data-offset-x=44></div><div data-offset -x=44></div><div data-offset-x=44></div><div data-offset-x=44></div><div data-of fset-x=64 data-offset-y=0></div> 202 <div data-offset-x=44></div><div data-offset-x=44></div><div data-offset -x=44></div><div data-offset-x=44></div><div data-offset-x=44></div><div data-of fset-x=64 data-offset-y=0></div>
203 </div> 203 </div>
204 </div> 204 </div>
205 205
206 206
207 <div class="flexbox fixed row vertical-rl"> 207 <div class="flexbox fixed row vertical-rl">
208 <div data-expected-height=100 data-expected-width=100> 208 <div data-expected-height=100 data-expected-width=100>
209 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=0></div> 209 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=0></div>
210 </div> 210 </div>
211 <div data-expected-height=100 data-expected-width=40 style="-webkit-align-se lf: flex-start;"> 211 <div data-expected-height=100 data-expected-width=40 style="align-self: flex -start;">
212 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=100></div> 212 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=100></div>
213 </div> 213 </div>
214 </div> 214 </div>
215 215
216 <div class="flexbox fixed column vertical-rl"> 216 <div class="flexbox fixed column vertical-rl">
217 <div data-expected-height=200 data-expected-width=50> 217 <div data-expected-height=200 data-expected-width=50>
218 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=80></div><div data-offset-x=80></div><div data-offset-x=80></div><div data-of fset-x=60 data-offset-y=0></div> 218 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=80></div><div data-offset-x=80></div><div data-offset-x=80></div><div data-of fset-x=60 data-offset-y=0></div>
219 </div> 219 </div>
220 <div data-expected-height=200 data-expected-width=50 style="-webkit-align-se lf: flex-start;"> 220 <div data-expected-height=200 data-expected-width=50 style="align-self: flex -start;">
221 <div data-offset-x=30></div><div data-offset-x=30></div><div data-offset -x=30></div><div data-offset-x=30></div><div data-offset-x=30></div><div data-of fset-x=10 data-offset-y=0></div> 221 <div data-offset-x=30></div><div data-offset-x=30></div><div data-offset -x=30></div><div data-offset-x=30></div><div data-offset-x=30></div><div data-of fset-x=10 data-offset-y=0></div>
222 </div> 222 </div>
223 </div> 223 </div>
224 224
225 <div class="flexbox fixed column vertical-rl"> 225 <div class="flexbox fixed column vertical-rl">
226 <div data-expected-height=200 data-expected-width=50> 226 <div data-expected-height=200 data-expected-width=50>
227 <div data-offset-x=80></div><div data-offset-x=80></div> 227 <div data-offset-x=80></div><div data-offset-x=80></div>
228 </div> 228 </div>
229 <div data-expected-height=80 data-expected-width=50 style="-webkit-align-sel f: flex-start;"> 229 <div data-expected-height=80 data-expected-width=50 style="align-self: flex- start;">
230 <div data-offset-x=30></div><div data-offset-x=30></div> 230 <div data-offset-x=30></div><div data-offset-x=30></div>
231 </div> 231 </div>
232 </div> 232 </div>
233 233
234 <div class="flexbox auto row vertical-rl" data-expected-height=500> 234 <div class="flexbox auto row vertical-rl" data-expected-height=500>
235 <div data-expected-height=250 data-expected-width=100> 235 <div data-expected-height=250 data-expected-width=100>
236 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=0></div> 236 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=0></div>
237 </div> 237 </div>
238 <div data-expected-height=250 data-expected-width=40 style="-webkit-align-se lf: flex-start;"> 238 <div data-expected-height=250 data-expected-width=40 style="align-self: flex -start;">
239 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=250></div> 239 <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset -x=60 data-offset-y=250></div>
240 </div> 240 </div>
241 </div> 241 </div>
242 242
243 <div data-expected-height=500 data-expected-width=80 class="flexbox auto column vertical-rl"> 243 <div data-expected-height=500 data-expected-width=80 class="flexbox auto column vertical-rl">
244 <div data-expected-height=500 data-expected-width=40> 244 <div data-expected-height=500 data-expected-width=40>
245 <div data-offset-x=60></div><div data-offset-x=60></div><div data-offset -x=60></div><div data-offset-x=60></div><div data-offset-x=60></div><div data-of fset-x=40 data-offset-y=0></div> 245 <div data-offset-x=60></div><div data-offset-x=60></div><div data-offset -x=60></div><div data-offset-x=60></div><div data-offset-x=60></div><div data-of fset-x=40 data-offset-y=0></div>
246 </div> 246 </div>
247 <div data-expected-height=500 data-expected-width=40 style="-webkit-align-se lf: flex-start;"> 247 <div data-expected-height=500 data-expected-width=40 style="align-self: flex -start;">
248 <div data-offset-x=20></div><div data-offset-x=20></div><div data-offset -x=20></div><div data-offset-x=20></div><div data-offset-x=20></div><div data-of fset-x=0 data-offset-y=0></div> 248 <div data-offset-x=20></div><div data-offset-x=20></div><div data-offset -x=20></div><div data-offset-x=20></div><div data-offset-x=20></div><div data-of fset-x=0 data-offset-y=0></div>
249 </div> 249 </div>
250 </div> 250 </div>
251 251
252 </body> 252 </body>
253 </html> 253 </html>
OLDNEW
« LayoutTests/css3/flexbox/anonymous-block-merge-crash.html ('K') | « LayoutTests/css3/flexbox/intrinsic-min-width-applies-with-fixed-width.html ('k') | LayoutTests/css3/flexbox/multiline.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698