Centrage avec la position absolue en CSS
Il existe une méthode astucieuse pour centrer un élément en utilisant le positionnement absolu. Il est possible de faire en sorte que l'élément soit placé exactement au centre de la fenêtre du navigateur. Pour cela, il ne faut pas définir de dimensions à l'élément et en même temps définir un positionnement depuis les quatre côtés :
<div id="elem"></div>
#elem {
position: absolute;
top: 30px;
right: 30px;
bottom: 30px;
left: 30px;
border: 1px solid green;
}
:
En utilisant la méthode décrite, créez un bloc
situé au centre de l'écran et avec une marge
de 100px sur tous les côtés.
En utilisant la méthode décrite, créez un bloc
avec une marge de 100px depuis le haut du bord de l'écran,
de 200px depuis la droite,
de 50px depuis le bas,
et de 10px depuis la gauche.