Position

30 min 2 exercices Niveau 5

La position des éléments est essentielle dans la mise en page d’une page web. C’est ce qui définit tout le design d’un site internet.

La propriété position

Afin de gérer le positionnement des éléments, le langage CSS met à disposition la propriété position.

Cette propriété doit d’abord recevoir une des valeurs suivantes :

  • static
  • relative
  • fixed
  • absolute
  • sticky

Ensuite, les éléments sont positionnés en utilisant les propriétés CSS suivantes : top, left, right, bottom. Néanmoins, la propriété position doit d’abord être définie avec une des valeurs listées ci-dessus ; si tel n’est pas le cas, top, left, right, bottom ne fonctionnent pas.

La position statique

Les éléments HTML sont, par défaut, placés en position statique (static, en anglais). La position de ces éléments n’est pas modifiable en utilisant les propriétés haut, bas, gauche, droite.

Les éléments utilisant position: static; ne sont pas positionnés de manière particulière. Ils suivent simplement le flux de la page.

La position relative

logo discord

Besoin d'aide ?

Rejoignez notre communauté officielle et ne restez plus seul à bloquer sur un problème !

En savoir plus