HTML and CSS Reference
In-Depth Information
Aligns the bottom of the image with the baseline of
the text.
align=“baseline”
is the same as
align=“bottom”
, but
align=“baseline”
is a more
descriptive name. This is the default vertical alignment
and can be written in CSS as
vertical-align:
baseline
.
align=“baseline”
Aligns the bottom of the image with the lowest item in
the line (which may be below the baseline of the text).
Replaced in CSS by
vertical-align: text-bottom
.
align=“absbottom”
The following code shows these alignment options at work:
Input
▼
<h2>
Middle of Text and Line aligned, arrow varies:
</h2>
<p>
<img src=”line.gif” />
Align: Top
<img src=”uparrow.gif” align=”top” />
Align: Text Top
<img src=”uparrow.gif” align=”texttop” />
</p>
<h2>
Top of Text and Line aligned, arrow varies:
</h2>
<p>
<img src=”line.gif” />
Align: Absolute Middle
<img src=”forward.gif” align=”absmiddle” />
Align: Middle
<img src=”forward.gif” align=”middle” />
</p>
<h2>
Top of Text and Line aligned, arrow varies:
</h2>
<p>
<img src=”line.gif” />
Align: Baseline / Bottom
<img src=”down.gif” align=”baseline” />
Align: Absolute Bottom
<img src=”down.gif” align=”absbottom” />
</p>
Figure 9.7 shows examples of all the options as they appear in a browser. In each case,
the line on the left side and the text are aligned with each other, and the position of the
arrow varies.
