layout/reftests/table-background/border-collapse-opacity-table-row.html@925c144e1f1f
layout/reftests/table-background/border-collapse-opacity-table-row.html
Fri, 16 Jan 2015 18:13:44 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Fri, 16 Jan 2015 18:13:44 +0100
- branch
- TOR_BUG_9701
- changeset 14
- 925c144e1f1f
- permissions
- -rw-r--r--
Integrate suggestion from review to improve consistency with existing code.
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
2 "http://www.w3.org/TR/html4/strict.dtd">
3 <html lang="en-US">
4 <head>
5 <title>Table background tests</title>
6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7 <meta http-equiv="Content-Style-Type" content="text/css">
8 <style type="text/css">
10 html, body { margin: 0; padding: 0; border: 0; font-size: 16px; }
11 body { padding: 15px; }
13 .o { opacity: 0.5; }
15 table {
16 margin: 0 3px 2px 4px; /* zero top to work around collapsing bug */
17 border: transparent solid;
18 border-width: 4px 2px 8px 6px; /* collapsed */
19 padding: 3px 7px 8px 6px; /* ignored */
20 border-collapse: collapse;
21 }
23 td {
24 border: transparent solid;
25 border-width: 2px 0 4px 2px; /* collapsed */
26 padding: 1px 2px 4px 3px;
27 empty-cells: show;
28 }
30 div { height: 10px; width: 50px; }
32 table.color tr.t { background-color: aqua; }
34 table.imagetl tr.t, table.imagebr tr.t {
35 background-image: url(repeatable-diagonal-gradient-with-ticks.png);
36 }
38 table.imagetl tr.t { background-position: top left; /* default */ }
39 table.imagebr tr.t { background-position: bottom right; /* default */ }
41 </style>
42 </head>
43 <body>
45 <table class="color">
46 <colgroup><col></colgroup>
47 <colgroup class="t">
48 <col>
49 <col class="t">
50 <col>
51 </colgroup>
52 <colgroup><col></colgroup>
53 <tbody>
54 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
55 </tbody>
56 <tbody class="t">
57 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
58 <tr class="t o"><td><div></div></td><td><div></div></td><td class="t"><div></div></td><td><div></div></td><td><div></div></td></tr>
59 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
60 </tbody>
61 <tbody>
62 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
63 </tbody>
64 </table>
66 <table class="imagetl">
67 <colgroup><col></colgroup>
68 <colgroup class="t">
69 <col>
70 <col class="t">
71 <col>
72 </colgroup>
73 <colgroup><col></colgroup>
74 <tbody>
75 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
76 </tbody>
77 <tbody class="t o">
78 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
79 <tr class="t"><td><div></div></td><td><div></div></td><td class="t"><div></div></td><td><div></div></td><td><div></div></td></tr>
80 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
81 </tbody>
82 <tbody>
83 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
84 </tbody>
85 </table>
87 <table class="imagebr">
88 <colgroup><col></colgroup>
89 <colgroup class="t o">
90 <col>
91 <col class="t o">
92 <col>
93 </colgroup>
94 <colgroup><col></colgroup>
95 <tbody>
96 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
97 </tbody>
98 <tbody class="t">
99 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
100 <tr class="t"><td><div></div></td><td><div></div></td><td class="t o"><div></div></td><td><div></div></td><td><div></div></td></tr>
101 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
102 </tbody>
103 <tbody>
104 <tr><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td><td><div></div></td></tr>
105 </tbody>
106 </table>
108 </body>
109 </html>
