Padding & Margin

Tailwind CSS 🟢 Junior

Definition

Classes p-* et m-* pour controler le padding et la marge. Variantes directionnelles (px, py, pt, pr, pb, pl) et valeurs negatives (-m-*).

Analogie

Le padding c'est le rembourrage dans un colis, la marge c'est l'espace entre les colis sur l'etagere.

Exemple de code

<div class="p-6 m-4">
  <div class="px-4 py-2 mt-2 -ml-1">
    Padding horizontal 1rem, vertical 0.5rem
  </div>
</div>

Cas d'usage

Controler l'espacement interne et externe de chaque element dans le layout.

Termes lies

#styling#tailwind