OLD | NEW |
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> | 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> |
2 <head> | 2 <head> |
3 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> | 3 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> |
4 <title>Background on 'table-column'</title> | 4 <title>Background on 'table-column'</title> |
5 <link rel="next" href="backgr_border-table-cell.html" title="Background with Bor
ders: Background on 'table-cell'"> | 5 <link rel="next" href="backgr_border-table-cell.html" title="Background with Bor
ders: Background on 'table-cell'"> |
6 <link rel="prev" href="backgr_border-table-row.html" title="Background with Bord
ers: Background on 'table-row'"> | 6 <link rel="prev" href="backgr_border-table-row.html" title="Background with Bord
ers: Background on 'table-row'"> |
7 <link rel="contents" href="./backgr_index.html" title="Table of Contents"> | 7 <link rel="contents" href="./backgr_index.html" title="Table of Contents"> |
8 <link rel="stylesheet" type="text/css" href="common.css"> | 8 <link rel="stylesheet" type="text/css" href="resources/common.css"> |
9 <style type="text/css"> | 9 <style type="text/css"> |
10 | 10 |
11 table { border: 3px do
tted} | 11 table { border: 3px do
tted} |
12 .col-1 {background: black url(../images/edge.gif) bottom right no-repeat; bord
er: 5px dashed} | 12 .col-1 {background: black url(resources/edge.gif) bottom right no-repeat; bord
er: 5px dashed} |
13 .a, .m { border: 5px da
shed} | 13 .a, .m { border: 5px da
shed} |
14 .col-2 {background: black url(../images/edge.gif) bottom right no-repeat; bord
er: 9px dashed} | 14 .col-2 {background: black url(resources/edge.gif) bottom right no-repeat; bord
er: 9px dashed} |
15 .f { border: 9px da
shed} | 15 .f { border: 9px da
shed} |
16 .col-3 {background: black url(../images/edge.gif) top left no-repeat; bord
er: 5px dashed} | 16 .col-3 {background: black url(resources/edge.gif) top left no-repeat; bord
er: 5px dashed} |
17 .g { border: 5px da
shed} | 17 .g { border: 5px da
shed} |
18 | 18 |
19 </style> | 19 </style> |
20 </head> | 20 </head> |
21 <body> | 21 <body> |
22 <h1>CSS2 Table Backgrounds Test Suite</h1> | 22 <h3>crbug.com/35679: Background on 'table-column'</h3> |
23 | |
24 <h2>Part D: Background with Borders</h2> | |
25 | |
26 <h3>Background on 'table-column'</h3> | |
27 | |
28 <p>Three columns are styled.</p> | |
29 <p>In the first column, there should be three vertical stripes along the pad
ding edge of the first cell, continuing down through the column. (In cell E, the
aqua stripe will be obscured by the thicker right border.) The stripes will cut
across cell E as well, but will be further obscured by its thick border. In the
border-collapsed table, the same will happen to the vertical stripes in cell A
due to cell B's thick border. The stripes should continue in the last cell, turn
ing a right angle to the left into three aqua stripes along the bottom border ed
ge of the last cell. The last cell (M) should not have three vertical stripes al
ong its right edge.</p> | |
30 <p>In the second column, three vertical strips should run along the right of
the first three cells, aligning along cell F's right padding edge. (The stripes
will be partially obscured by cell B's thick border.)</p> | |
31 <p>In the third column, there should be three vertical stripes should run ac
ross the top of the first cell and down the left of the column, aligning along c
ell K's left padding edge. In border-collapse mode, they will be partially obscu
red by cell B's thick border.</p> | |
32 | |
33 <dl> | |
34 <dt>next | |
35 <dd><a href="backgr_border-table-cell.html">Background with Borders: B
ackground on 'table-cell'</a> | |
36 <dt>previous | |
37 <dd><a href="backgr_border-table-row.html">Background with Borders: Ba
ckground on 'table-row'</a> | |
38 <dt>contents | |
39 <dd><a href="./backgr_index.html">Table of Contents</a> | |
40 </dl> | |
41 | |
42 <table class="separate"> | 23 <table class="separate"> |
43 <caption>With 'border-collapse: separate'</caption> | 24 <caption>With 'border-collapse: separate'</caption> |
44 <colgroup class="colgroup-A"> | 25 <colgroup class="colgroup-A"> |
45 <col class="col-1"> | 26 <col class="col-1"> |
46 <col class="col-2"> | 27 <col class="col-2"> |
47 <col class="col-3"> | 28 <col class="col-3"> |
48 </colgroup> | 29 </colgroup> |
49 <colgroup class="colgroup-B"> | 30 <colgroup class="colgroup-B"> |
50 <col class="col-4"> | 31 <col class="col-4"> |
51 </colgroup> | 32 </colgroup> |
(...skipping 21 matching lines...) Expand all Loading... |
73 </tr> | 54 </tr> |
74 <tr class="tb-row-2"> | 55 <tr class="tb-row-2"> |
75 | 56 |
76 <td class="j">TD J</td> | 57 <td class="j">TD J</td> |
77 <td class="k">TD K</td> | 58 <td class="k">TD K</td> |
78 <td class="l">TD L</td> | 59 <td class="l">TD L</td> |
79 </tr> | 60 </tr> |
80 </tbody> | 61 </tbody> |
81 </table> | 62 </table> |
82 | 63 |
83 <table class="collapse"> | 64 <p>Three columns are styled.</p> |
84 <caption>With 'border-collapse: collapse'</caption> | 65 <p>In the first column, there should be three vertical stripes along the pad
ding edge of the first cell, continuing down through the column. (In cell E, the
aqua stripe will be obscured by the thicker right border.) The stripes will cut
across cell E as well, but will be further obscured by its thick border. In the
border-collapsed table, the same will happen to the vertical stripes in cell A
due to cell B's thick border. The stripes should continue in the last cell, turn
ing a right angle to the left into three aqua stripes along the bottom border ed
ge of the last cell. The last cell (M) should not have three vertical stripes al
ong its right edge.</p> |
85 <colgroup class="colgroup-A"> | 66 <p>In the second column, three vertical strips should run along the right of
the first three cells, aligning along cell F's right padding edge. (The stripes
will be partially obscured by cell B's thick border.)</p> |
86 <col class="col-1"> | 67 <p>In the third column, there should be three vertical stripes should run ac
ross the top of the first cell and down the left of the column, aligning along c
ell K's left padding edge. In border-collapse mode, they will be partially obscu
red by cell B's thick border.</p> |
87 <col class="col-2"> | |
88 <col class="col-3"> | |
89 </colgroup> | |
90 <colgroup class="colgroup-B"> | |
91 <col class="col-4"> | |
92 </colgroup> | |
93 <thead> | |
94 <tr class="th-row-1"> | |
95 <th class="a">TH A</th> | |
96 <th class="b">TH B</th> | |
97 <th class="c">TH C</th> | |
98 <th class="d">TH D</th> | |
99 </tr> | |
100 </thead> | |
101 <tfoot> | |
102 <tr class="tf-row-1"> | |
103 <td class="m" colspan=2>TD M</td> | |
104 | |
105 <td class="o">TD O</td> | |
106 <td class="p">TD P</td> | |
107 </tfoot> | |
108 <tbody> | |
109 <tr class="tb-row-1"> | |
110 <td class="e" rowspan=2>TD E</td> | |
111 <td class="f">TD F</td> | |
112 <td class="g">TD G</td> | |
113 <td class="h">TD H</td> | |
114 </tr> | |
115 <tr class="tb-row-2"> | |
116 | |
117 <td class="j">TD J</td> | |
118 <td class="k">TD K</td> | |
119 <td class="l">TD L</td> | |
120 </tr> | |
121 </tbody> | |
122 </table> | |
123 <div class="validity"> | 68 <div class="validity"> |
124 <a href="http://validator.w3.org/check/referer"><img | 69 <a href="http://validator.w3.org/check/referer"><img |
125 src="../images/valid-html401.png" height="31" width="88" | 70 src="resources/valid-html401.png" height="31" width="88" |
126 alt="Valid HTML 4.01!"></a> | 71 alt="Valid HTML 4.01!"></a> |
127 </div> | 72 </div> |
128 <address> | 73 <address> |
129 CSS2 Table Backgrounds Test Suite designed and written by fantasai <fantasa
i@escape.com> | 74 CSS2 Table Backgrounds Test Suite designed and written by fantasai <fantasa
i@escape.com> |
130 </address> | 75 </address> |
131 | 76 |
132 </body> | 77 </body> |
133 </html> | 78 </html> |
OLD | NEW |