Vertical Centering of Single Lines of Text
It is natural to try using the vertical-align property to center elements
vertically within a containing element, but it doesn??™t work. However, if you
just want to center a single line of type within a containing element, that??™s
doable. In CSS, you can achieve vertical centering, for a single line of text at
least, by setting its line height equal to the height of the containing element.
Because the line height is split between the top and bottom of the text, the
text ends up centered vertically.
Vertically centering a block of text, such as a p element, within a containing
element is almost impossible, although with some extra divs, it is doable.
Rather than get into a lengthy explanation here, I refer you to ???Vertical
Centering in CSS??? (www.jakpsatweb.cz/css/css-vertical-center-solution.html).
You can do this, but it ain??™t pretty. Sometimes, you just have to wonder why
such a basic necessity wasn??™t addressed in the CSS spec.
Text-Transform Property
Example: p {text-transform: capitalize;}
Values: uppercase, lowercase, capitalize, none
text-transform changes the capitalization of text within an element.
You can force a line of text to have initial letters capitalized, all
text uppercase, or all text lowercase. Figure 3.23 shows the various
options.
STYLIN??™ WITH CSS - CHAPTER 3 94
FIGURE 3.
Pages:
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137