Conseil

Couleurs

Utiliser toujours le couple (color/background-color). Au pire spécifier explicitement, background-color:transparent;

Positionnement absolue

1. Les positions top/left/bottom/right sont absolues par rapport au BODY ou une balise parente avec la propriété position:relative.

<body>

  
  <!-- je déplace de 5em avec une marge cette division -->
  <div style="margin-top:5em;">
   <!-- absolutediv1 sera placé à la position (0,0/haut,gauche) de la balise body - du document  -->
   <div id="absolutediv1" style="position:absolute;top:0;left:0;">
   </div>
  </div>

  <!-- je déplace de 5em avec une marge cette division et je met position:relative -->
  <div style="position:relative;    margin-top:5em">
   <!-- absolutediv2 sera placé à la position (0,0/haut,gauche) de la balise div précédente -->
    <div id="absolutediv2" style="position:absolute;top:0;left:0;>
    </div>
  </div>

</body>

2. Il faut toujours utiliser au moins une propriété top/bottom et au moins une propriété left/right pour ne pas avoir de problème avec du position:absolute. Exemple: 

#a {position:absolute; top:5px;    left:5px; }
#b {position:absolute; bottom:5px; left:5px; }
#c {position:absolute; top:5px;    right:5px; }
#d {position:absolute; bottom:5px; right:5px; }

Documentation

Test et compatibilité

Médias

Tutoriels pour débutant

Advanced Technique

Ajouter votre commentaire