Lors du développement de sources web modernes, nous rencontrons toujours les tâches suivantes : afficher un texte descriptif sur la carte produit ; ouvrir un message popup ; démontrer une fenêtre modale, et, bien sûr, un affichage pratique du menu mobile. Pour atteindre tous ces objectifs, nous utilisons la propriété position.

position: static | relative | absolute | fixed | sticky

La propriété position est utilisée pour modifier le positionnement d'un élément. Par défaut, tous les éléments possèdent position: static. Une fois qu'une valeur différente est attribuée à la propriété position, nous pouvons également utiliser les propriétés top, left, right et bottom pour positionner un élément selon nos besoins. Nous les examinerons tous plus en détail.

Flux de document par défaut

Le flux de document par défaut est la manière dont les éléments sont positionnés sur une page web sans aucune instruction de positionnement spécifique appliquée. Les éléments sont disposés dans l'ordre où ils apparaissent dans le balisage HTML.

Remarque

Il est recommandé de maintenir tous les éléments dans le flux de document par défaut, sauf dans les situations où le positionnement est nécessaire à des fins décoratives ou pour atteindre des fonctionnalités spécifiques telles que les popups, les fenêtres modales, les menus déroulants, les menus mobiles, etc.