A Complete Guide to Web Design

180 Chapter 10 – Tables

Basic Table Structure

Web Design in a Nutshell, eMatter Edition

Row span

Similar tocolspan, therowspanattribute stretches a cell to occupy the space of

cells in rows below. Include therowspanattribute in the row where you want the

cell to begin and set its value equal to the number of rows you want it to span.

In Figure 10-3, note that the bottom row now only contains one cell (the other

one has been incorporated into the vertical spanned cell). The resulting spanned

cell is illustrated in the figure on the left. The browser ignores over-extended

rowspanvalues.

You may combinecolspanandrowspanattributes to create a cell

that spans both rows and columns.

Row and Column Groups

Internet Explorer 3.0 introduced a system for grouping rows and columns so they

can be treated as units by style sheets or other HTML formatting tags. The system

is now reflected in the W3C 4.0 Specification for tables, so it bears mentioning

here. However, support for row and column groups is far from universal as of this

writing (in fact, Navigator 4.0 doesn’t recognize them at all), so keep them in

mind, but use them with caution.

Row groups

Rows can be classified into a table head (<thead>), a table foot (<tfoot>), and

one or more table body (<tbody>). The head and foot should contain informa-

tion about the document and may someday be used to display fixed elements

while the body scrolls independently. It is recommended by the W3C that the foot

(if there is one) appear before the body of the table so the table can render the

foot before downloading all of the (potentially numerous) rows of data.

Therulesattribute in the table tag may use row group information for placing

rules within a table.

Figure 10-3: The rowspan attribute spans cells vertically

<TABLE>

<TD ROWSPAN=2> </TD>

<TR> </TR>

<TR>

<TD> </TD>

<TD> </TD> </TR>

</TABLE>

<TABLE>

<TR>

<TD rowspan=2>cell 1</TD>

<TD>cell2</TD>

</TR>

<TR>

<TD>cell 4</TD>

</TR>

</TABLE>