ptg16476052264 LESSON 10: Building Tables
Cell and Caption Alignment
After you have your rows and cells in place inside your table and the table is properly
aligned on the page, you can align the captions and the data within each cell for the best
effect, based on what your table contains. You can align the data within your cells both
horizontally and vertically. Figure 10.17 shows a table of the various alignment options.Horizontal alignment (the text-align property) defines whether the data within a cell is
aligned with the left cell margin (left), the right cell margin (right), or centered within
the two (center).
Vertical alignment (the vertical-align property) defines the vertical alignment of the
data within the cell: flush with the top of the cell (top), flush with the bottom of the cell
(bottom), or vertically centered within the cell (middle). You can also use vertical-
align: baseline;, which is similar to vertical-align: top; except that it aligns the
baseline of the first line of text in each cell. (Depending on the contents of the cell, this
might or might not produce a different result than vertical-align: top;.)
By default, heading cells are centered both horizontally and vertically, and data cells are
centered vertically but aligned flush left. Captions are centered horizontally, and if your
caption has a height, the contents will be aligned at the top vertically.
You can override the defaults for an entire row by adding the text-align or vertical-
align properties to the <tr> element, as in the following:
<tr style="text-align: right; vertical-align: middle;">FIGURE 10.17
Aligned content
within cells.