Typography and Web Fonts - The CSS - page 154

/* normal, small-caps, 400, 15px/19px "Trebuchet MS", Verdana,
sans-serif */
body>h3 { font: small-caps 15px "Trebuchet MS", Verdana,
➥ sans-serif; }

/* oblique, normal, bold, 20px/24px monospace */
body>h5 { font: bold oblique 1em/1.2em monospace; }

vertical-align
The vertical-align property sets the alignment of text (or other inline
content) in relation to the line box controlled via line-height . Because
this property controls the positioning of an inline element in relation to
a line box and not a block element, it is not suitable for aligning block
elements in a layout grid. The default value of baseline creates an align-
ment where the bottom of the characters in each inline element on a
line all start at the same position. The following are commonly used
values for vertical-align ( Figure 9.2 ):

■ baseline : Aligns the baseline of the box with the parent element's
baseline

■ sub : Creates a subscript by lowering the baseline of the box
■ super : Creates a superscript by raising the baseline of the box

p {

font-size: 20px;
vertical-align: baseline;
color: #666;
background: #eee;

}
sup {
font-size: 1em;
vertical-align: super;

}