Spring Into HTML and CSS

Spanning Rows

As you're setting up your data table, you might find that you need to have a single column span a number of rows within the table. To do this, you'll use the rowspan attribute with the value of rows you want to span to the table header or table cell in question (see Example 4-9).

Example 4-9. Using rowspan to span two rows

<table width="90%" border="1" cellspacing="5" cellpadding="5" summary="This table demonstrates rowspan"><caption>Demonstrating rowspan</caption><tr><th rowspan="2">Header (spans 2 rows)</th><td>data</td><td>data</td></tr><tr><td>data</td><td>data</td></tr><tr><th>Header (no span)</th><td>data</td><td>data</td></tr></table>

Figure 4-10 shows the spanned header rows.

Figure 4-10. Spanning rows within table ...