HTML and CSS Reference
In-Depth Information
Aligning Text
In addition to table borders and striping, the alignment of text within cells, both horizontal
and vertical, plays an integral role in table formatting. Names, descriptions, and so forth
are commonly flush left, while numbers and other figures are flush right. Other informa-
tion, depending on its context, may be centered. We can move text horizontally using the
text-align property in CSS, as we covered in Lesson 6 , “ Working with Typography .
To align text vertically, however, the vertical-align property is used. The
vertical-align property works only with inline and table-cell elements—it won't
work for block, inline-block, or any other element levels.
The vertical-align property accepts a handful of different values; the most popular
values are top , middle , and bottom . These values vertically position text in relation to
the table cell, for table-cell elements, or to the closest parent element, for inline-level ele-
ments.
By revising the HTML and CSS to include the text-align and vertical-align
properties, we can clean up the layout of our table of books. Note that the data within the
table becomes much clearer and more digestible (see Figure 11.10 ).
Search WWH ::




Custom Search