<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
<html xmlns="" xml:lang="fi" lang="fi">
<link rel="StyleSheet" href="relative.css" type="text/css" media="screen" />
<title>Suhteellinen sijoittelu</title>
<h1>Suhteellinen sijoittelu</h1>
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>

<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.