POSITION ET DISPLAY

POSITION

Propriétée qui permet de gerer les positions.

Flux

La mise en place des différents éléments de la page = FLUX. Les blocs positionnés en "absolu" ou "fixé" sortent du flux naturel. Ils ne sont alors plus dépendant des éléments frères. C'est le comportement naturel d'affichage des éléments d'une page web.

Position relative

Est une variante du positionnement courant qui provoque un décalage. Elle permet de décaler un élément par rapport à une position de référence: celle qu'il avait dans le flux.

Position absolute

Elle permet de ne pas dépendre de l'ordre dans lequel les éléments HTML sont déclarés dans le code, contrairement aux flottants

Position fixe

Elle s'apparente au positionnement absolu, à l'exception des points suivants:

-Lorsque le positionnement est précisé (top, right, …), l'élément est toujours positionné par rapport à la fenêtre du navigateur

-L'élément est fixé à un endroit et ne pourra se mouvoir, même lors de la présence d'une barre de défilement. En d'autres termes, la position intiale est fixée au chargement de la page, le fait qu'une éventuelle scrollbar puisse être utilisée n'a aucune influence sur le positionnement de l'élément: il ne bouge plus de la position initialement définie.

Position static

Elle correspond à la valeur par défaut d'un élément du flux. Son but est de rétablir dans le flux un élément parmi une série qui serait positionnée hors du flux.

FLOAT

La propriété float existe pour répondre à un besoin typographique: la création d'habillages ("enrouler" un texte autour d'un élément). Un élément flottant adopte la largeur qu'occupe son contenu. Le principe de base est simple: un élément flottant est ôté partiellement du flux et placé à l'extrême gauche (float:left) ou droite (float:right) de son conteneur, forçant tout contenu du flux qui suit à l'envelopper.

DISPLAY

Tout élément peut être "reclassé" dans la famille opposée grâce à la propriété display. L'élément étant totalement extrait du flux, il ne dépend plus du tout des éléments qui le côtoient.

- Méthode radicale (mais puissante)

L'élément, n'étant plus dans le flux naturel, perd une de ses caractéristiques majeures qui est celle de recouvrir la totalité de la largeur disponible de l'élément parent. Un élément bénéficiant d'une position absolue ne bougera pas de sa position initiale tant que l'une des propriétés top, bottom, left ou right n'a pas été précisée; il s'agit d'ailleurs là d'un comportement appliquable à toutes les positions.