Perbedaan Padding dan Margin

Perbedaan Padding dan Margin - Ada pepatah mengatakan, sebuah lukisan bisa menceritakan ribuan kata, nah coba lihat gambar dibawah:

Saya rasa, cukup mencerna gambar diatas selama beberapa menit sudah cukup menceritakan perbedaan antara PADDING dan MARGIN. Yah, gambar ini sudah menghemat ratusan kata kan? Tapi ijinkan saya mendeskripsikan lagi menurut hemat saya, apa sebenarnya perbedaan PADDING dan MARGIN ini.

Misalkan kita membuat satu table dengan Margin 5px, maka space kosong dari border table ke arah luar sebesar 5px tadi adalah MARGIN. Lalu jika membuat satu table dengan padding 5px, maka space kosong antara border dengan content adalah PADDING, it’s as simple as that. Gunakan border pada table kamu dan akan lebih kelihatan jelas perbedaannya.

Semoga penjelasan tentang Perbedaan Padding dan Margin membantu dan bisa menjadi acuan dalam mendesign HTML dan CSS, untuk kapan lebih baik menggunakan MARGIN atau PADDING.

sumber lengkap + gambar : http://www.w3.org/TR/css3-background/