http://appro.mit.jyu.fi/2000/syksy/tietoverkot/luennot/luento9/relative.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi" lang="fi">
<head>
<link rel="StyleSheet" href="relative.css" type="text/css" media="screen" />
<title>Suhteellinen sijoittelu</title>
</head>
<body>
<h1>Suhteellinen sijoittelu</h1>
<blockquote 
  cite="http://www.w3.org/TR/REC-CSS2/visuren.html#relative-positioning">
<p>
Once a box has been laid out according to the <span class="up">normal
flow</span>, it may be shifted <span class="down">relative</span> to this
position. This is called relative positioning. Offsetting a box <span
class="left">(B1)</span> in this way has no effect on the box <span
class="right">(B2)</span> that follows: B2 is given a position as if B1
were not offset and B2 is not re-positioned after B1's offset is applied.
<span class="right down">This implies that relative positioning may cause
boxes to overlap.</span>
</p>

<p>
<span class="left">
Relatively positioned boxes keep their normal flow size, including line
breaks and the space originally reserved for them. A relatively positioned
box establishes a new a new containing block for normal flow children and
positioned descendants.
</span>
</p>
</blockquote>
</body>
</html>