p-*m-*Skala spacing

Layout: Margin & Padding

Mengatur jarak dengan p-* (dalam) dan m-* (luar) memakai skala spacing 4px yang konsisten.

Padding vs margin

Padding adalah jarak di dalam elemen (antara konten dan bordernya), margin adalah jarak di luar (menjauhkan elemen dari tetangganya). Keduanya memakai skala yang sama: satu satuan = 0.25rem = 4px, jadi p-4 = 16px dan m-8 = 32px.

Padding vs margin live

margin luar (m-3 di area titik)

padding dalam (p-6)

Skala spacing & arah

Utility bisa menunjuk sisi spesifik: px-4 (kiri-kanan), py-2 (atas-bawah), mt-6, mb-2, bahkan ms-4/me-4 untuk logical property yang mengikuti arah tulisan. Skala konsisten inilah rifa desain terasa selaras tanpa piksel acak.

Skala spacing & arah live

p-2

p-4

p-6

p-8