Boot Camp

Web Authoring Boot Camp
Beverage
Size
Mocha
50oz
Table Cell and Row Spans
Cells may span several rows or columns. The number of rows or columns spanned by a
cell is set by the rowspan and colspan attributes for the TH and TD elements. This can be
helpful for tables where your first row acts as a singled header for several columns below
it. Or when you want to make a single column span two rows to insert a larger image.
Colspan
The colspan is short for column span, which means coding a table data cell to stretch the
length of its own column plus one or more next to it.
When you stretch a column to take the space of two in its own row, you define that it
actually takes the place of the second table data cell. This is why you see only two table
data cells coded in row one of the table below.
Rowspan
The rowspan is short for row span, in which you code a table data cell to stretch to the
height to its own row and one or more below it.
When you stretch a row to take the space of two, you define that it actually takes the
place of the following row’s table data cell that would visually appear just below it. This
is why you see only two table data cells coded in row three of the table below.
In order for you to even tell this is a table in the browser view, we need to add border information
to the table shell and the table data cells: style=”border:1px black solid”, etc.
122