1 <!DOCTYPE html>
2 <html><head><title>CSS Basic User Interface Test: cursor:auto on form elements</title>
3 <link href="mailto:florian@rivoal.net" rel="author" title="Florian Rivoal">
4 <link href="http://www.w3.org/TR/css3-ui/#cursor" rel="help">
5 <meta content="interact may" name="flags">
6 <meta charset="UTF-8">
7 <meta content="The 'auto' cursor value does the same as 'default' over everything other than text, such as form elements." name="assert">
8 <style>
9 #test {
10 border: solid blue;
11 width: 200px;
12 cursor: auto;
13 }
14 #test * {
15 cursor: url("support/cursors/fail.png"), help !important; /* Override UA styles, regardless of specificity */
16 cursor: auto !important; /* Override UA styles, regardless of specificity */
17 resize: none; /* The appearance of the cursor over UA provided resize controls is out of scope. */
18 overflow: hidden; /* The appearance of the cursor over UA provided scroll controls is out of scope */
19 }
20 #ref {
21 width: 100px;
22 height: 100px;
23 cursor: default;
24 border: solid orange;
25 }
26 :root {
27 cursor: help; /* give the root element a different cursor so that
28 it is easy to tell if something changes when hovering the target.*/
29 }
30 </style>
31 </head><body>
32 <p>The test passes if, when moved over every element inside the blue box, the cursor remains the platform-dependent default cursor.</p>
33 <p>Place the cursor into the orange box for a reference of what this should look like.</p>
34 <div id="test">
35 <button>button</button>
36 <textarea></textarea>
37 <input>
38 <input type="button" value="input-button">
39 <select></select>
40 </div>
41 <div id="ref"></div>
42
43 </body></html>