Les marges internes (padding) permettent de créer de l'espace entre la bordure d'une boîte (border) et le texte ou le contenu de l'élément HTML.

Les éléments de type bloc ont des marges sur les 4 côtés de leur boîte.

Les éléments en ligne ont des marges uniquement à droite et à gauche.

On ne peut pas affecter de couleur aux marges internes : elles prennent la couleur de fond de la boîte ou laissent apparaitre son image de fond.

Certains éléments peuvent avoir des marges internes prédéfinies par les navigateurs (par exemple body, p, ul, etc). Ces valeurs prédéfinies peuvent être différentes d'un navigateur à un autre.
Pour être sûr d'avoir les mêmes marges sur tous les navigateurs, il est conseillé de les fixer dans la feuille de style pour les éléments utilisés dans les pages (voir Principes généraux => La cascade).

Si les marges internes ne sont pas prédéfinies ou omises, elles ont par défaut la valeur 0.

L'unité de taille pour définir une marge est à choisir en fonction du dispositif d'affichage. Par exemple il ne faut pas utiliser des centimètres pour afficher sur un écran pour lequel on privilégiera le pixel CSS (px), le cadratin (em), le pourcentage (%) ou la référence à la racine du document (rem).
Les unités utilisées peuvent être différentes pour chacune des marges d'un élément.

Si les marges internes hautes et basses (padding-top et padding-bottom) sont exprimées en pourcentage (%), la valeur est calculée par rapport à la longueur de la boîte et pas par rapport à la hauteur.

La propriété padding est un raccourci qui permet de définir les marges des 4 côtés en une seule fois.

On peut affecter 1, 2, 3 ou 4 valeurs à la propriété padding.

h1 { padding: 5px; }
h2 { padding: 4px 8px; }
h3 { padding: 5px 6px 7px 8px; }

Remarque : la forme avec 3 valeurs est rarement utilisée : la marge haute aura la 1ère valeur, les marges droite et gauche auront la 2ème valeur et la marge basse aura la 3ème valeur.

Propriétés individualisées

div {
	padding-top: 10px;
	padding-right: 1em;
	padding-bottom: 10%;
	padding-left: 2.5rem;
}