padding-top

La propriété padding-top d'un élément ajuste la hauteur de la boîte de remplissage (padding) en haut de l'élément. La zone de remplissage correspond à l'espace entre le contenu et la bordure. Contrairement à margin-top, padding-top ne peut pas recevoir de valeurs négatives.

Valeur initiale	`0`
Applicabilité	tous les éléments exceptés `table-row-group`, `table-header-group`, `table-footer-group`, `table-row`, `table-column-group` et `table-column`. S'applique aussi à `::first-letter`.
Héritée	non
Pourcentages	se rapporte à la largeur du bloc contenant
Média	visuel
Valeur calculée	le pourcentage tel que spécifé ou une longeur absolue
Animable	oui, comme une longueur
Ordre canonique	l'ordre unique et non-ambigu défini par la grammaire formelle

Syntaxe

/* Valeurs de longueur */
/* Type <length>       */
padding-top: 0.5em;
padding-top: 0;
padding-top: 2cm;

/* Valeurs de proportions */
/* Type <percentage>      */
padding-top: 10%;

/* Valeurs globales */
padding-top: inherit;
padding-top: initial;
padding-top: unset;

Valeurs

<length>: Cette valeur définit une hauteur positive. Voir <length> pour plus de détails.
<percentage>: Un pourcentage en rapport avec la largeur du bloc englobant.

Syntaxe formelle

<length> | <percentage>

Exemples

HTML

<p class="padd">
  Elle n’avait pas bu la moitié de la bouteille, 
  que sa tête touchait au plafond et qu’elle fut
  forcée de se baisser pour ne pas se casser le 
  cou.
</p>

CSS

.padd {
  padding-top: 5em;
  border: solid 1px;
}

Résultat

Spécifications

Spécification	Statut	Commentaires
CSS Basic Box Model La définition de 'padding-top' dans cette spécification.	Version de travail	Aucun changement depuis CSS Level 2 (Revision 1) La définition de 'padding-top' dans cette spécification..
CSS Transitions La définition de 'padding-top' dans cette spécification.	Version de travail	`padding-top` peut désormais être animée.
CSS Level 2 (Revision 1) La définition de 'padding-top' dans cette spécification.	Recommendation	Aucun changement depuis CSS Level 1 La définition de 'padding-top' dans cette spécification..
CSS Level 1 La définition de 'padding-top' dans cette spécification.	Recommendation	Définition initiale.

Fonctionnalité	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Support simple	1.0	1.0 (1.0)	4.0	3.5	1.0 (85)

Fonctionnalité	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Support simple	?	?	?	?	?