backgr_position-table-cell.html 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  4. <title>Background on 'table-cell'</title>
  5. <link rel="next" href="backgr_layers-show.html" title="Background Layers: empty-cells: show">
  6. <link rel="prev" href="backgr_position-table-column.html" title="Background Position: Background on 'table-column'">
  7. <link rel="contents" href="./backgr_index.html" title="Table of Contents">
  8. <link rel="stylesheet" type="text/css" href="common.css">
  9. <style type="text/css">
  10. .e {background: black url(edge.gif) top left no-repeat}
  11. .m {background: black url(edge.gif) bottom right no-repeat}
  12. </style>
  13. </head>
  14. <body>
  15. <h1>CSS2 Table Backgrounds Test Suite</h1>
  16. <h2>Part B: Background Position</h2>
  17. <h3>Background on 'table-cell'</h3>
  18. <p>Two cells are styled.</p>
  19. <p>There should be three aqua stripes just inside the top and left padding edges of cell E.</p>
  20. <p>There should be three aqua stripes just inside the bottom and right padding edges of Cell M</a>
  21. <dl>
  22. <dt>next
  23. <dd><a href="backgr_layers-show.html">Background Layers: empty-cells: show</a>
  24. <dt>previous
  25. <dd><a href="backgr_position-table-column.html">Background Position: Background on 'table-column'</a>
  26. <dt>contents
  27. <dd><a href="./backgr_index.html">Table of Contents</a>
  28. </dl>
  29. <table class="separate">
  30. <caption>With 'border-collapse: separate'</caption>
  31. <colgroup class="colgroup-A">
  32. <col class="col-1">
  33. <col class="col-2">
  34. <col class="col-3">
  35. </colgroup>
  36. <colgroup class="colgroup-B">
  37. <col class="col-4">
  38. </colgroup>
  39. <thead>
  40. <tr class="th-row-1">
  41. <th class="a">TH A</th>
  42. <th class="b">TH B</th>
  43. <th class="c">TH C</th>
  44. <th class="d">TH D</th>
  45. </tr>
  46. </thead>
  47. <tfoot>
  48. <tr class="tf-row-1">
  49. <td class="m" colspan=2>TD M</td>
  50. <td class="o">TD O</td>
  51. <td class="p">TD P</td>
  52. </tfoot>
  53. <tbody>
  54. <tr class="tb-row-1">
  55. <td class="e" rowspan=2>TD E</td>
  56. <td class="f">TD F</td>
  57. <td class="g">TD G</td>
  58. <td class="h">TD H</td>
  59. </tr>
  60. <tr class="tb-row-2">
  61. <td class="j">TD J</td>
  62. <td class="k">TD K</td>
  63. <td class="l">TD L</td>
  64. </tr>
  65. </tbody>
  66. </table>
  67. <table class="collapse">
  68. <caption>With 'border-collapse: collapse'</caption>
  69. <colgroup class="colgroup-A">
  70. <col class="col-1">
  71. <col class="col-2">
  72. <col class="col-3">
  73. </colgroup>
  74. <colgroup class="colgroup-B">
  75. <col class="col-4">
  76. </colgroup>
  77. <thead>
  78. <tr class="th-row-1">
  79. <th class="a">TH A</th>
  80. <th class="b">TH B</th>
  81. <th class="c">TH C</th>
  82. <th class="d">TH D</th>
  83. </tr>
  84. </thead>
  85. <tfoot>
  86. <tr class="tf-row-1">
  87. <td class="m" colspan=2>TD M</td>
  88. <td class="o">TD O</td>
  89. <td class="p">TD P</td>
  90. </tfoot>
  91. <tbody>
  92. <tr class="tb-row-1">
  93. <td class="e" rowspan=2>TD E</td>
  94. <td class="f">TD F</td>
  95. <td class="g">TD G</td>
  96. <td class="h">TD H</td>
  97. </tr>
  98. <tr class="tb-row-2">
  99. <td class="j">TD J</td>
  100. <td class="k">TD K</td>
  101. <td class="l">TD L</td>
  102. </tr>
  103. </tbody>
  104. </table>
  105. <div class="validity">
  106. <a href="http://validator.w3.org/check/referer"><img
  107. src="valid-html401.png" height="31" width="88"
  108. alt="Valid HTML 4.01!"></a>
  109. </div>
  110. <address>
  111. CSS2 Table Backgrounds Test Suite designed and written by fantasai &lt;fantasai&#64;escape.com&gt;
  112. </address>
  113. </body>
  114. </html>