Vertical alignment
By default, the bottom of an image aligns with the baseline of
the surrounding text (see Figure
12-1), but there are ways to change the vertical alignment. The
preferred method is to use style sheets. Using HTML markup alone, the
HTML 4.01 Recommendation includes the deprecated align attribute with the values top, middle, and bottom for vertical alignment. The HTML 3.2
Recommendation also included the values texttop, absmiddle, baseline, and absbottom, but they were dropped from future
specifications and are only partially supported by modern browsers.
Figure 12-4 shows the
effects of these alignment values.
Figure 12-4. Vertical alignment values
The preferred CSS method for specifying vertical alignment is
via the vertical-align property,
which may be used to change the alignment of an image relative to the
baseline or the height of the line it occupies. The accepted values
are top, text-top, bottom, text-bottom, middle, sub, super, and baseline (the default), as well as specific
length or percentage values. See Chapter
18 for explanations of vertical alignment with CSS.
Get Web Design in a Nutshell, 3rd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
