position: static;

Le mode de positionnement par défaut est le positionnement dans le flux normal. La propriété position a la valeur static (ou n'est pas précisée).

Les éléments HTML sont positionnés au fur et à mesure qu'ils sont rencontrés dans le code source de la page. Les boîtes bloc générées sont affichées les unes en dessous des autres, alignées verticalement sur leur marge extérieure gauche. Les boîtes en ligne générées sont affichées les unes à côté des autres, alignées horizontalement sur leur marge extérieure inférieure.

La propriété margin permet de définir les marges hautes et basses qui séparent les boîtes de bloc.
Fusion des marges : quand 2 boîtes de type bloc se suivent, la marge inférieure de la première et la marge supérieure de la seconde ne s'ajoutent pas : seule la marge la plus grande est conservée.

Les propriétés left, top, right et bottom n'ont aucune influence sur le positionnement statique et les spécifier ne sert à rien car elles seront ignorées.

L'exemple suivant montre une boîte de type bloc (div) qui contient des boîtes en ligne et 2 autres boîtes de type bloc (p). Comme aucune propriété de position n'est donnée, toutes les boîtes sont positionnées suivant le flux normal.

On peut noter que :

• les marges entre les 2 paragraphes sont bien fusionnées et que la distance est de 10 pixels et non pas 2 * 10 pixels,
• la distance entre la bordure gauche de la boîte div et la bordure gauche des paragraphes est de 5 pixels (marge intérieure du div) + 10 pixels (marges extérieur du p). Idem pour les bords droits et les bords inférieurs.
• les boîtes des images sont alignées sur la ligne de base du texte qui les entoure et non pas sur le bord inférieur de ces boîtes en ligne. C'est l 'alignement vertical par défaut des images (vertical-align: baseline). Pour aligner les images avec les boîtes de la même ligne, il faut utiliser : vertical-align: bottom