CSS Débutant .com

le Padding en CSS

Défintion

le "Padding", c'est la distance entre le bord d'un élément HTML et son contenu

Héritage

Il n'y pas de notion d'héritage pour les marges (voir notion d'héritage sur ce lien)

Syntaxe

padding-top: espace en pixels ou pourcentage; padding-left: espace en pixels ou pourcentage; padding-right: espace en pixels ou pourcentage; padding-bottom: espace en pixels ou pourcentage;

Vous avez 2 possibilités :

• Espace en pixels (exemple 10px)
• Pourcentage (70%)

Vous pouvez aussi déclarer vos marges comme cela :
padding: 10px 10px 10px 10px;

Les valeurs définissent l'espace entre les éléments HTML dans cet ordre :

1. haut
2. droite
3. bas
4. gauche

Si ne renseignez qu'une valeur, elle sera prise par défaut pour les autres espaces entre les éléments HTML

padding: 10px;

Si vous renseignez deux ou trois valeurs, elles seront la références pour les cotés opposés.
padding: 10px 10px; /* 2 valeurs */ padding: 10px 10px 10px; /* 3 valeurs */

Vous pouvez définir des marges à zéro. Si vous ne définissez pas les marges, elles prenent 0 comme valeur par défaut.
padding: -10px;

Attention

Il ne faut pas mettre "px" si la valeur est zéro (Voir exemple ci-dessus)

L'exemple ci-dessous défini une marge de 20px à la balise "container"
#container{ margin: 20px; background: #eeeeee; <span class="greenboldtext">padding: 30px;</span> font-size: small; font-family: "Tahoma", Arial, sans-serif; text-align: left; }

Mettre en formes du contenu type texte >>>