This browser does not support basic Web standards, preventing the display of our site's intended design. May we suggest that you upgrade your browser?

HTML Coding

Tables: Row Span

Note: The HTML pages are out-of-date and will not be updated.

Varying the span of rows in a table can be helpful for grouping information, adding emphasis, or eliminating empty cells. In the first example below, an empty cell would have occurred below "green" in the second row, as there is no data to fill in; adjusting the row span makes it clear that "green" is the only entry. In the second example, adding the ROWSPAN attribute to the <TD> code allowed using one cell for two rows. In order to adjust the row span of one cell, place the ROWSPAN attribute before the data within the <TD> code for that cell.

return to topA Table With Row Span

Red Green Blue
Orange Purple
<TABLE BORDER=1>
<TR>
<TD>Red</TD>
<TD ROWSPAN=2>Green</TD>
<TD>Blue</TD>
</TD>
</TR>
<TR>
<TD>Orange</TD>
<TD>Purple</TD>
</TR>
</TABLE>

return to topA Table With Side Header Row Span

Colors 1 Red Green Blue
Orange Yellow Purple
Colors 2 Pink Gray White
Black Tan Cream
<TABLE BORDER=1>
<TR>
<TH ROWSPAN=2>Colors 1</TH>
<TD>Red</TD>
<TD>Green</TD>
<TD>Blue</TD>
</TR>
<TR>
<TD>Orange</TD>
<TD>Yellow</TD> <TD>Purple</TD> </TR> <TR>
<TH ROWSPAN=2>Colors 2</TH>
<TD>Pink</TD>
<TD>Gray</TD>
<TD>White</TD>
</TR>
<TR>
<TD>Black</TD>
<TD>Tan</TD>
<TD>Cream</TD>
</TR>
</TABLE>
Excellence. Our Measure. Our Motto. Our Goal.