layout/reftests/table-background/backgr_border-table-row.html
author dtownsend@oxymoronical.com
Tue, 29 Jan 2008 18:00:45 -0800
changeset 10979 6e65d9a3ce0fe82b0205f096b7725a91da479bb0
parent 2066 5a4262b1b29d56cce6e32f86c9fd7e67a86062b7
permissions -rw-r--r--
Bug 406807: Remove unneccesary parts of xpinstall. r=bsmedberg, sr=dveditz, a=damons

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Background on 'table-row'</title>
<link rel="next" href="backgr_border-table-column.html" title="Background with Borders: Background on 'table-column'">
<link rel="prev" href="backgr_border-table-column-group.html" title="Background with Borders: Background on 'table-column-group'">
<link rel="contents" href="./backgr_index.html" title="Table of Contents">
<link rel="stylesheet" type="text/css" href="common.css">
<style type="text/css">

  table     {                                                        border: 3px dotted}
  .th-row-1 {background: black url(edge.gif) bottom right no-repeat; border: 5px dashed}
  .d        {                                                        border: 5px dashed}
  .tb-row-1 {background: black url(edge.gif) bottom left  no-repeat; border: 9px dashed}
  .g        {                                                        border: 9px dashed}
  .tb-row-2 {background: black url(edge.gif) top left     no-repeat; border: 5px dashed}
  .k        {                                                        border: 5px dashed}

</style>
</head>
<body>
<h1>CSS2 Table Backgrounds Test Suite</h1>

<h2>Part D: Background with Borders</h2>

    <h3>Background on 'table-row'</h3>

    <p>Three rows are styled.</p>
    <p>The first row should have three aqua stripes just inside the bottom and right padding edges of its last cell. The bottom three stripes should continue across the row, appearing along the bottom of cells A, B, and C. (The bottom aqua stripe will be obscured by the thicker bottom border in cell B.)</p>
    <p>The second row should have three vertical aqua stripes a few pixels to the right of the left padding edge. Three horizontal aqua stripes should cut across the first cell and align along the bottom border edge of cell G.</p>
    <p>The third row should have three horizontal aqua stripes along the top of the last three cells, aligning along cell K's top padding edge. The stripes will not continue into cell E.</p>
    <dl>
       <dt>next
          <dd><a href="backgr_border-table-column.html">Background with Borders: Background on 'table-column'</a>
       <dt>previous
          <dd><a href="backgr_border-table-column-group.html">Background with Borders: Background on 'table-column-group'</a>
       <dt>contents
          <dd><a href="./backgr_index.html">Table of Contents</a>
    </dl>

    <table class="separate">
    <caption>With 'border-collapse: separate'</caption>
    <colgroup class="colgroup-A">
      <col class="col-1">
      <col class="col-2">
      <col class="col-3">
    </colgroup>
    <colgroup class="colgroup-B">
      <col class="col-4">
    </colgroup>
    <thead>
      <tr class="th-row-1">
        <th class="a">TH A</th>
        <th class="b">TH B</th>
        <th class="c">TH C</th>
        <th class="d">TH D</th>
      </tr>
    </thead>
    <tfoot>
      <tr class="tf-row-1">
        <td class="m" colspan=2>TD M</td>

        <td class="o">TD O</td>
        <td class="p">TD P</td>
    </tfoot>
    <tbody>
      <tr class="tb-row-1">
        <td class="e" rowspan=2>TD E</td>
        <td class="f">TD F</td>
        <td class="g">TD G</td>
        <td class="h">TD H</td>
      </tr>
      <tr class="tb-row-2">

        <td class="j">TD J</td>
        <td class="k">TD K</td>
        <td class="l">TD L</td>
      </tr>
    </tbody>
    </table>

    <table class="collapse">
    <caption>With 'border-collapse: collapse'</caption>
    <colgroup class="colgroup-A">
      <col class="col-1">
      <col class="col-2">
      <col class="col-3">
    </colgroup>
    <colgroup class="colgroup-B">
      <col class="col-4">
    </colgroup>
    <thead>
      <tr class="th-row-1">
        <th class="a">TH A</th>
        <th class="b">TH B</th>
        <th class="c">TH C</th>
        <th class="d">TH D</th>
      </tr>
    </thead>
    <tfoot>
      <tr class="tf-row-1">
        <td class="m" colspan=2>TD M</td>

        <td class="o">TD O</td>
        <td class="p">TD P</td>
    </tfoot>
    <tbody>
      <tr class="tb-row-1">
        <td class="e" rowspan=2>TD E</td>
        <td class="f">TD F</td>
        <td class="g">TD G</td>
        <td class="h">TD H</td>
      </tr>
      <tr class="tb-row-2">

        <td class="j">TD J</td>
        <td class="k">TD K</td>
        <td class="l">TD L</td>
      </tr>
    </tbody>
    </table>
<div class="validity">
  <a href="http://validator.w3.org/check/referer"><img
     src="valid-html401.png" height="31" width="88"
     alt="Valid HTML 4.01!"></a>
</div>
<address>
  CSS2 Table Backgrounds Test Suite designed and written by fantasai &lt;fantasai&#64;escape.com&gt;
</address>

</body>
</html>