Spanning Multiple Rows and Columns


Cells within HTML tables can span multiple rows and multiple columns. The cell default is one row and one column. However, with the ROWSPAN attribute a cell can span more than one row, and with the COLSPAN attribute a cell can span more than one column.

Here are two table examples, the first one with cells spanning multiple columns using the COLSPAN attribute and the second one with cells spanning multiple rows using ROWSPAN attribute.


<TABLE BORDER="1">
<CAPTION>Example 1:  COLSPAN</CAPTION>
<TR>
<TD>Apples</TD> <TD COLSPAN="2">Bananas</TD> <TD COLSPAN="2">Cherries</TD>
</TR>
<TR>
<TD COLSPAN="3">Nectarines</TD> <TD>Oranges</TD> <TD>Papaya</TD>
</TR>
</TABLE>
Example 1: COLSPAN
Apples Bananas Cherries
Nectarines Oranges Papaya

<TABLE BORDER="1">
<CAPTION>Example 2:  ROWSPAN</CAPTION>
<TR>
<TD ROWSPAN="4">Apples</TD> <TD>Bananas</TD> <TD ROWSPAN="4">Cherries</TD>
</TR>
<TR>
<TD>Nectarines</TD>
</TR>
<TR>
<TD>Oranges</TD>
</TR>
<TR>
<TD>Papaya</TD>
</TR>
</TABLE>
Example 2: ROWSPAN
Apples Bananas Cherries
Nectarines
Oranges
Papaya

I understand these table attributes. What is next?
[INDEX] [PREVIOUS] [NEXT PAGE] [CHAPTER 8]

Valid HTML 3.2!