layout/reftests/table-background/backgr_border-table-column.html

Thu, 15 Jan 2015 15:55:04 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Thu, 15 Jan 2015 15:55:04 +0100
branch
TOR_BUG_9701
changeset 9
a63d609f5ebe
permissions
-rw-r--r--

Back out 97036ab72558 which inappropriately compared turds to third parties.

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

mercurial