OLD | NEW |
| (Empty) |
1 <!DocType html> | |
2 <html> | |
3 <head> | |
4 <style> | |
5 div { | |
6 border:1px solid red; | |
7 line-height:1em; | |
8 } | |
9 .borderRadius { | |
10 padding:10px; | |
11 -webkit-border-radius: 9px; | |
12 } | |
13 </style> | |
14 </head> | |
15 | |
16 <body> | |
17 <script> | |
18 if (window.testRunner) | |
19 testRunner.setUseMockTheme(false); | |
20 </script> | |
21 | |
22 <div> | |
23 | |
24 Whitespace in option text:<select><option>f o o</option></select>a<select><opti
on DISABLED>f o o</option></select>b<br><br> | |
25 Simple select control:<select><option>foo</option><option>bar</option></select>a
<select DISABLED><option>foo</option><option>bar</option></select>b<br><br> | |
26 Line-height should be ignored:<select style="line-height:2em"><option>foo</optio
n></select>a<select style="line-height:2em" DISABLED><option DISABLED>foo</optio
n><option>bar</option></select>b<br><br> | |
27 Padding should be respected, the arrow button shouldn't change size:<select styl
e="padding:4px;"><option>foo</option></select>a<select style="padding:4px;" DISA
BLED><option>foo</option></select>b<br><br> | |
28 Border should be respected:<select style="border:8px solid #3cf;"><option>foo</o
ption></select>a<select style="border:8px solid #3cf;" DISABLED><option>foo</opt
ion></select>b<br><br> | |
29 Border + padding:<select style="padding:5px;border:4px solid #3cf;"><option>foo<
/option></select>a<select style="padding:5px;border:4px solid #3cf;" DISABLED><o
ption>foo</option></select>b<br><br> | |
30 Height larger than font-size, button should grow, text baseline should center:<s
elect style="height:30px"><option>foo</option></select>a<select style="height:30
px" DISABLED><option DISABLED>foo</option></select>b<br><br> | |
31 Height smaller than font-size, whole select shrinks but baseline is unchanged:<s
elect style="height:3px"><option>foo</option><option>bar</option></select>a<sele
ct style="height:3px"><option DISABLED>foo</option><option>bar</option></select>
b<br><br> | |
32 | |
33 | |
34 select control with size=0: | |
35 <br> | |
36 <select size=0> | |
37 <option>Future Series </option> | |
38 <option>ICC Intercontinental Cup </option> | |
39 <option>Twenty20 World Championship </option> | |
40 <option>Stanford 20/20 </option> | |
41 <option>All future series </option> | |
42 </select> | |
43 <br> | |
44 | |
45 select control with size=1: | |
46 <br> | |
47 <select size=1> | |
48 <option>Future Series </option> | |
49 <option>ICC Intercontinental Cup </option> | |
50 <option>Twenty20 World Championship </option> | |
51 <option>Stanford 20/20 </option> | |
52 <option>All future series </option> | |
53 </select> | |
54 <br> | |
55 | |
56 Non-styled select control: | |
57 <br> | |
58 <select class="borderRadius" style="border-width:1px"> | |
59 <option>Future Series </option> | |
60 <option>ICC Intercontinental Cup </option> | |
61 <option>Twenty20 World Championship </option> | |
62 <option>Stanford 20/20 </option> | |
63 <option>All future series </option> | |
64 </select> | |
65 <br> | |
66 | |
67 Styled select control with large border-radius: | |
68 <br> | |
69 <select class="borderRadius" style="background-color:#3cf"> | |
70 <option>Future Series </option> | |
71 <option>ICC Intercontinental Cup </option> | |
72 <option>Twenty20 World Championship </option> | |
73 <option>Stanford 20/20 </option> | |
74 <option>All future series </option> | |
75 </select> | |
76 <br> | |
77 | |
78 </div> | |
79 | |
80 </body> | |
81 </html> | |
OLD | NEW |