<body>
<p>
Notice that the graphic in Figure 7-21 is not precisely 40%
over from the left and 60% down from the top.
That’s because the top-left of the graphic is not
the positioning point. Instead, the point is
inside the graphic at its 40/60 coordinate.
Absolute positioning units (inches, px, and so on)
can also be used to position a background graphic,
using the usual
</p>
<p>
You can apply this same offsetting principle to text in
various ways. One way is to add an icon--like this
watch graphic perhaps--to the side of each of your
paragraphs. Flow the paragraphs around the image.
Or use an overlapping capital letter at the start
of a paragraph. This technique, called a drop cap,
has been used for centuries as a way of adding
variety to pages of text.
</p>
</body>
</html>
Figure 8-8:
If you want
a drop-cap
at the start
of every
paragraph,
try using the
first-
letter
pseudo-
element.
162 Part III: Adding Artistry: Design and Composition with CSS
