outline-color-001

outline-color - inherit (basic)

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Assertion
Test checks that the color of sub element outline is same as the color of parent element outline when outline-color set inherit

Source

 1 <!DOCTYPE html>
 2 <html><head><meta charset="utf-8">
 3 <title>CSS Basic User Interface Test: outline-color - inherit (basic) </title>
 4 <link href="http://www.intel.com/" rel="author" title="Intel">
 5 <link href="http://www.w3.org/TR/css3-ui/#outline-color" rel="help" title="7.4. 'outline-color' property">
 6 <link href="mailto:shiyoux.tan@intel.com" rel="author" title="Shiyou Tan">
 7 <link href="reference/ref-filled-green-100px-square.htm" rel="match">
 8 <meta content="" name="flags">
 9 <meta content="Test checks that the color of sub element outline is same as the color of parent element outline when outline-color set inherit" name="assert">
10 <style>
11   #container {
12     background-color: red;
13     height: 100px;
14     width: 100px;
15   }
16   #parent {
17     background-color: red;
18     height: 80px;
19     left: 10px;
20     outline-color: green;
21     outline-style: solid;
22     outline-width: 10px;
23     position: relative;
24     top: 10px;
25     width: 80px;
26   }
27   #child {
28     background-color: green;
29     height: 60px;
30     left: 10px;
31     outline-color: inherit;
32     outline-style: solid;
33     outline-width: 10px;
34     position: relative;
35     top: 10px;
36     width: 60px;
37   }
38 </style>
39 </head><body>
40   <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
41   <div id="container">
42     <div id="parent">
43       <div id="child"></div>
44     </div>
45   </div>
46 
47 </body></html>