Padding

Setelah kalian mempelajari margin, seharusnya tidak susah untuk mempelajari padding. Jika margin berfungsi untuk memberi jarak bagian luar, padding berfungsi untuk memberi jarak bagian dalam atau dari dalam elemen itu sendiri.

Gambaran

Perhatikan kotak di bawah:

Teks di dalam elemen terlihat sangat mepet kan? Untuk memberikan jarak di dalam kita bisa berikan padding, dan akan menjadi seperti ini:

Lebih nyaman dilihat bukan?

Cara Menggunakan

Cara menggunakan padding sama persis dengan margin. Jadi ada yang sisi spesifik:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

{
    /* Untuk memberi padding pada sisi atas */
    padding-top: UKURAN;

    /* Untuk memberi padding pada sisi kanan */
    padding-right: UKURAN;

    /* Untuk memberi padding pada sisi bawah */
    padding-bottom: UKURAN;

    /* Untuk memberi padding pada sisi kiri */
    padding-left: UKURAN;
}

dan yang umum padding. Aturan penggunaannya juga persis dengan properti margin.