First, it is important to note that simply applying position: relative to an element changes nothing by itself: the element will continue to act in a standard, statically positioned way. However, adding relative does give us access to the properties top, left, bottom and right. As soon as position: relative is applied and any of these properties are given values, two things happen:

1. Visually, the affected element is taken out of the “flow” of the document, while any space reserved for its original static position is retained;
2. The element is displaced by the value given to top, left, bottom and/or right, relative to its original static position.

It is still appropriate to apply float to elements that are given position: relative, so for the purposes of example, continued from the last entry, our code becomes:

<p><img src="assets/images/pericles.jpg" 
style="position: relative; top: 2em; right: 4em;" 
alt="Bust of Pericles">
Pericles was a prominent statesman, orator, and naval general of Athens 
during the city-states's <q>Golden Age</q>, from 448BCE until his death 
in 429.  Pericles was a promoter of the arts (particularly plays), 
architecture (it was under his patronage that the Parthenon was built), 
and the principles of democracy, but he was also an instigator of war:
Pericles is widely held to be responsible for maneuvering Athens 
into the disastrous Peloponnesian  War with Sparta.</p>

As you can see, the image is displaced 2em down from the top of its original position, and 4em from the right. The space originally reserved for the image is kept, and the element now overlaps our text, while being partially off the side of the screen.

Perhaps the easiest way of thinking of position: relative is that it can be used to “nudge” elements when you don't wish to affect the layout on the rest of your page. Because the original space given to the element is reserved, you can ease the values given to top, left, bottom and/or right up and down (negative values can also be used) without any concern that the rest of your design will be affected.

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.