|
1 <!DOCTYPE HTML> |
|
2 <html> |
|
3 <!-- |
|
4 https://bugzilla.mozilla.org/show_bug.cgi?id=323656 |
|
5 --> |
|
6 <head> |
|
7 <title>Test for Bug 323656</title> |
|
8 <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> |
|
9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" /> |
|
10 <style> |
|
11 /** |
|
12 * The idea is that "color" inherits by default while "border-color" does |
|
13 * not. So if the former is red and the latter is green on a parent, and |
|
14 * the child's border-color is set to "inherit", it'll be green only if |
|
15 * the child is inheriting from the parent. If not, it'll either be |
|
16 * whatever the border-color is on what it's inheriting from, which will |
|
17 * be red if what it's inheriting from has the default (currentColor) |
|
18 *border-color). |
|
19 */ |
|
20 |
|
21 /* 't' for "test" */ |
|
22 #display, #display * |
|
23 { color: red; border: 0px hidden red; background: transparent } |
|
24 #display .t { border-color: green } |
|
25 #display .t > :first-child |
|
26 { border-color: inherit; border-style: solid; border-width: 10px } |
|
27 </style> |
|
28 </head> |
|
29 <body> |
|
30 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=323656">Mozilla Bug 323656</a> |
|
31 <p id="display"> |
|
32 <select size="1" class="t"> |
|
33 <option id="testOption"></option> |
|
34 </select> |
|
35 </p> |
|
36 <div id="content" style="display: none"> |
|
37 |
|
38 </div> |
|
39 <pre id="test"> |
|
40 <script class="testbody" type="text/javascript"> |
|
41 |
|
42 /** Test for Bug 323656 **/ |
|
43 var s = document.defaultView.getComputedStyle($("testOption"), ""); |
|
44 is(s.borderRightColor, "rgb(0, 128, 0)", "Inheritance broken"); |
|
45 |
|
46 |
|
47 </script> |
|
48 </pre> |
|
49 </body> |
|
50 </html> |
|
51 |