Positionnement relatif

Le positionnement dit relatif est relatif à la position normale dans le flux (au positionnement statique).

On indique une variation de la position grace aux propriété CSS top, right, bottom, et left.

Exemple

Prenons l’exemple suivant :

<p>a</p>
<p class="item">b</p>
<p>c</p>

Ce qui donnerait :

../../../_images/positionnements__relatif__base.svg

Maintenant imaginons que l’on utilise le CSS suivant :

.item {
   position: relative;
   top:  -10px;
   left: -10px;
}

Nous obtenons :

../../../_images/positionnements__relatif__applique.svg