table element

Type:	Tables
Attributes:	cellborder • cellmargin • cellpadding • table-layout • align • alt • background-color • background-image-dpi • background-image-position • background-image • background-pdf • border-color • border-style • border-width • border • clear • corner-radius • display • float • font-size • height • href • left • line-cap • line-height • line-join • margin • onmouseover • overflow • padding • page-break-after • page-break-inside • position • rotate • size • title • top • vertical-align • visibility • white-space • width • class • colorspace • direction • id • lang • pdf-tag-background-color • pdf-tag-border-color • pdf-tag-border-style • pdf-tag-border-thickness • pdf-tag-color • pdf-tag-list-numbering • pdf-tag-placement • pdf-tag-table-colspan • pdf-tag-table-headers • pdf-tag-table-rowspan • pdf-tag-table-scope • pdf-tag-table-summary • pdf-tag-text-align • pdf-tag-type
See:	tbody tfoot thead td tr

The table tag is used to create a table. Inside the table tag use the tr tag to define rows in the table, and the TH or td tags to define tables cells inside those rows.

If the table is expected to wrap at the end of the page, the table rows should be placed inside a thead, tbody or tfoot group as appropriate. Only one of each of these tags may exist in a table. Any row not explicitly contained in one of these tags is assumed to be in a TBODY.

The table model used here is slightly different to that used in HTML4, which is different again to that defined in CSS2. Here are the differences:

Table cells always take the full amount of space available to them. In HTML, specifying a small cell in a large column resulted in effectively a large margin - not so here.
Empty table cells are always displayed. In HTML, it is necessary to force this, usually by doing <td> </td>
The border attribute sets the border for the whole table, not the individual cells like in HTML (for which you can use cellborder). Likewise, the "cellspacing" attribute which sets the margin for each cell in HTML has been replaced with the cellmargin attribute.
Unlike the CSS2 model, table rows may have padding, margins and borders. These are restricted to the vertical axis only however - margin-left, padding-right and friends will always be forced to zero.
The collapsing borders algorithm recommended in CSS2 is not implemented
The CAPTION tag used in HTML is not implemented. Instead place a paragraph immediately before or after the table.
The "cols" and "rows" attributes available in HTML tables have no effect

Like other blocks, tables may be sized automatically depending on the size of their contents, or may have the width and height attributes set.

The margin, border and padding attributes are used to set those values for the whole table, not for the individual cells (so HTML programmers fed up with creating nested tables just to create a border around the table can relax).

The individual cells may also have their margins, padding and borders set seperately, or defaults may be set by setting the cellmargin, cellpadding or cellborder attributes on the table itself.

Finally, the actual layout algorithm used may be set to "auto" or "fixed" using the table-layout attribute. Both algorithms conform to the CSS2 recommendations.

Create a simple table which is autosized

<table>
<tr><td>Cell 1</td><td>Cell 2</td></tr>
<tr><td>Cell 3</td><td>Cell 4</td></tr>
</table>

Create a simple table which uses the "fixed" layout. The width must be specified for every cell in the first row and the table itself.

<table table-layout="fixed" width="200">
  <tr><td width="60%">Cell 1</td><td width="40%">Cell 2</td></tr>
  <tr><td>Cell 3</td><td>Cell 4</td></tr>
</table>

This shows how to use the ROWSPAN attribute.

<table>
  <tr>
    <th rowspan="2">First column, both rows</th>
    <td>Second column, first row</td>
  </tr>
  <tr>
    <td>Second column, second row</td>
  </tr>
</table>

In this example, the tables width takes precedence over the width set in the cells.

<table width="500">
  <tr>
    <td width="50">Cell 1</td>
    <td width="50">Cell 2</td>
  </tr>
</table>