untitled

(John Hannent) #1
position: fixed;}

p
{
display: table-cell;
vertical-align: middle;
}

Handling Inline Elements ............................................................................


In CSS, an inline element is a small element right within a line of text (such as
the <em>or <i>elements). You can fool around with inline elements in text in
many ways: drawing borders around individual words or phrases, padding,
including margins, inserting extra large characters or words, dropping
graphic images into the middle of a paragraph, and other annoying tricks.

Why annoying? These kinds of adjustments to text are almost always ugly
and unsophisticated. Just because CSS allows you to apply virtually any
property to any element doesn’t mean that you should.

Text manipulations, generally speaking, are best left to those who designed
the typeface in the first place. Start adding inline frames, borders, margins,
large characters or graphics in a line of text and you begin to approach the
unattractive, hard-to-read, text effects found in ransom notes and a child’s
first attempts at printing.

Figure 11-5:
Center
vertically by
freezing the
top margin.

Chapter 11: Designing with Auto and Inline Elements 203

Free download pdf