Les propriétés d'espacement

'padding-top', 'padding-right', 'padding-bottom', 'padding-left' et 'padding'

Ces propriétés spécifient la largeur de l'aire d'espacement d'une boîte. La propriété raccourcie 'padding' spécifie la valeur de l'espacement pour les quatres côtés à la fois, les autres propriétés fixant celle de leur côté respectif.

Les propriétés définies ici se réfèrent au type de valeur <espacement-largeur>, celui-ci accepte une des valeurs suivantes :

<longueur>

Spécifie une largeur fixe.

<pourcentage>

Le pourcentage est calculé par rapport à la largeur du bloc conteneur de la boîte générée. De même pour les propriétés 'padding-top' et 'padding-bottom'.

À la différence des propriétés de marge, les valeurs d'espacement ne peuvent pas être négatives. Les valeurs de pourcentage des propriétés d'espacement, tout comme celles des propriétés de marge, se réfèrent à la largeur du bloc conteneur de la boîte générée.

Les définitions des cinq propriétés relatives à l'espacement ('padding', 'padding-top', 'padding-right', 'padding-bottom' et 'padding-left') devraient dire que celles-ci ne s'appliquent pas aux éléments de table suivants : les rangées (N.D.T. table rows), les groupes de rangées (N.D.T. row groups), les groupes de rubriques (N.D.T. header groups), les groupes de pieds de page (N.D.T. footer groups), les colonnes (N.D.T. columns) et les groupes de colonnes (N.D.T. column groups).

'padding-top', 'padding-right', 'padding-bottom', 'padding-left'

Valeur :	<espacement-largeur> | inherit
Initiale :	0
S'applique à :	tous les éléments
Héritée :	non
Pourcentage :	se rapporte à la largeur du bloc conteneur
Médias :	visuel

Ces propriétés spécifient les espacements du haut, de droite, du bas et de gauche d'une boîte.

Exemple(s) :

BLOCKQUOTE { padding-top: 0.3em } 

'padding'

Valeur :	<espacement-largeur>{1,4} | inherit
Initiale :	non définie pour les propriétés raccourcies
S'applique à :	tous les éléments
Héritée :	non
Pourcentage :	se rapporte à la largeur du bloc conteneur
Médias :	visuel

La propriété raccourcie 'padding' sert à spécifier de manière groupée les propriétés 'padding-top', 'padding-right', 'padding-bottom' et 'padding-left' dans la feuille de style.

Quand il n'y a qu'une seule valeur spécifiée, celle-ci s'applique à tous les côtés. S'il y en a deux, alors la première valeur s'applique pour l'espacement du haut et celui du bas, et la seconde pour l'espacement de droite et celui de gauche. Avec trois valeurs, l'espacement du haut reçoit la première valeur, les espacements gauche et droite la deuxième et l'espacement du bas la troisième. Pour quatre valeurs, celles-ci s'appliquent respectivement aux espacements du haut, de droite, du bas et de gauche.

La couleur ou l'image de la surface de l'aire d'espacement sont indiquées avec la propriété 'background' :

Exemple(s) :

H1 { background: white; padding: 1em 2em; } 

Dans cet exemple, on spécifie un espacement vertical de '1em' ('padding-top' et 'padding-bottom') et un espacement horizontal de '2em' ('padding-right' et 'padding-left'). L'unité 'em' s'entend relativement à la taille de la police de l'élément : une valeur '1em' correspond à la taille de la police utilisée.