border-conflict-style-073

Border Conflict Resolution (by border style): 'outset' vs. 'double' - border with highest priority border style should dominate

WeasyPrint

This browser

Assertion
The 'double' border is the dominant border when it is collapsed with an 'outset' border of the same size.

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3     <head>
 4         <title>CSS Test: Border Conflict Resolution (by border style): 'outset' vs. 'double' - border with highest priority border style should dominate</title>
 5         <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
 6         <link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution">
 7         <meta name="flags" content="">
 8         <meta name="assert" content="The 'double' border is the dominant border when it is collapsed with an 'outset' border of the same size.">
 9         <style type="text/css">
10             #table1
11             {
12                 margin-bottom: 20px;
13             }
14             table
15             {
16                 border-collapse: collapse;
17             }
18             td
19             {
20                 border: 5px outset lime;
21                 height: 3em;
22                 width: 3em;
23             }
24             #center, #table1 td
25             {
26                 border: 5px double lime;
27             }
28             #top
29             {
30                 border-top: 5px outset red;
31             }
32             #left
33             {
34                 border-left: 5px outset red;
35             }
36             #bottom
37             {
38                 border-bottom: 5px outset red;
39             }
40             #right
41             {
42                 border-right: 5px outset red;
43             }
44         </style>
45     </head>
46     <body>
47         <p>Test passes if the center box in the table below has a border similar to this:</p>
48         <table id="table1">
49             <tr>
50                 <td></td>
51             </tr>
52         </table>
53         <table>
54             <tr>
55                 <td>outset</td>
56                 <td id="bottom">outset</td>
57                 <td>outset</td>
58             </tr>
59             <tr>
60                 <td id="right">outset</td>
61                 <td id="center">double</td>
62                 <td id="left">outset</td>
63             </tr>
64             <tr>
65                 <td>outset</td>
66                 <td id="top">outset</td>
67                 <td>outset</td>
68             </tr>
69         </table>
70     </body>
71 </html>