Remplissage et espacement des tableaux HTML

Les tableaux HTML peuvent ajuster le rembourrage à l'intérieur des cellules, ainsi que l'espace entre les cellules.

Tableau HTML - Remplissage des cellules

Le rembourrage de cellule est l'espace entre les bords de la cellule et le contenu de la cellule.

Par défaut, le rembourrage est défini sur 0.

Pour ajouter un rembourrage aux cellules d'un tableau, utilisez la paddingpropriété CSS :

th, td {
padding: 15px;
}

Pour ajouter un rembourrage uniquement au-dessus du contenu, utilisez la padding-toppropriété.

Et les autres côtés avec les propriétés padding-bottom, padding-leftet padding-right:

th, td {
  padding-top: 10px;
  padding-bottom: 20px;
  padding-left: 30px;
  padding-right: 40px;
}

L'espacement des cellules est l'espace entre chaque cellule.

Par défaut, l'espace est défini sur 2 pixels.

Pour modifier l'espace entre les cellules du tableau, utilisez la border-spacingpropriété CSS sur l' table élément :

table {
border-spacing: 30px;
}