Mise en forme des boites

Changer la mise en forme des boites avec les CSS.

D'abord, il faut se rappeler que tous les éléments HTML sont des boites qui ont les propriétés suivantes :

• un arrière-plan (background);
• une marge intérieure (padding);
• une bordure (border);
• une marge extérieure (margin).

Références importantes sur les quatre mises en forme de boites essentielles :

• background
• padding
• border
• margin

Centrer une boite dans son conteneur

Pour centrer une boite dans son conteneur, il faut d'abord réduire sa largeur en affectant la propriété width avec une valeur en pourcentage inférieure à 100%, et ensuite distribuer la différence de manière automatique entre les marges de droite et de gauche.

Exemple :

body {
    width: 60%;
    margin: auto;
}