HTML and CSS Reference
In-Depth Information
both horizontally and vertically. Figure 10.19 shows a table (a real HTML one!) of the
various alignment options.
FIGURE 10.19
Aligned content
within cells.
Horizontal alignment (the
align
attribute) 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
). The one place where the
align
attribute wasn't deprecated in XHTML
1.0 is the
<td>
and
<th>
tags. It's perfectly okay to use it within your tables. That said, it
is more efficient to align the contents of cells using CSS if you want to apply the align-
ment to many cells at once.
Vertical alignment (the
valign
attribute) 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
). Newer browsers also implement
valign=“baseline”
, which is similar to
valign=“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
valign=“top”
.)
By default, heading cells are centered both horizontally and vertically, and data cells are
centered vertically but aligned flush left.
You can override the defaults for an entire row by adding the
align
or
valign
attributes
to the
<tr>
element, as in the following:
<tr align=“center” valign=“top”>
