1 <!DOCTYPE html>
2 <html><head><title>CSS Basic User Interface Test: cursor, :hover and inheritance</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" name="flags">
6 <meta charset="UTF-8">
7 <meta content="Checks that a cursor set on an ancestor with the :hover pseudo class is properly inherited to the hovered child." name="assert">
8 <style>
9 #d1 {
10 width: 0;
11 height: 0;
12 position: relative;
13 cursor: url("support/cursors/fail.png"), help;
14 }
15 #d2 {
16 position: absolute;
17 top: 0; left: 0;
18 width: 100px;
19 height: 100px;
20 border: solid blue;
21 }
22 #d1:hover {
23 cursor: crosshair;
24 }
25 </style>
26 </head><body>
27 <p>The test passes if, when moved inside the blue box, the cursor looks like a crosshair (e.g. short line segments resembling a "+" sign).</p>
28 <div id="d1"><div id="d2"></div></div>
29
30 </body></html>