tRikSonic
Informasi : saat ini anda mengakses blog ini untuk halaman yang di percepat penggunaannya untuk mobile/handphone (AMP) atau akses mobile dengan kecepatan internet yang rendah, mungkin beberapa fitur diblog ini belum tersedia, silahkan ganti Thema untuk mengaktifkan beberapa fitur lainnya. Terimakasih

Perbedaan padding dan margin pada css

Terakhir diperbarui : 23 Mei 2018 - 10.22

Tutorial CSS - perbedaan padding dan margin

Perbedaan padding dan margin pada css, tutorial kali ini kita akan membahas tutorial ringan mengenai apa perbedaan padding dan margin pada css. Padding digunakan untuk memberikan ruang pada element yang membungkusnya atau memberikan ketebalan bidang element, sedangkan margin digunakan untuk memberikan ruang antara element satu dengan yang lainnya.
Artikel ini sengaja saya buat karena adanya pencarian yang masuk di blog ini dengan keyword perbedaan padding dan margin.
Ilustrasi ringan untuk memahami perbedaan padding dan margin adalah, anda mempunyai rumah yang ada pagarnya, nah padding itu ibarat jarak antara pagar dengan rumah anda.
Sedangkan ilustrasi untuk margin adalah anda mempunyai tetangga dan antara rumah anda dengan rumah tetangga anda mempunyai selokan sebagai pembatas, nah selokan tersebut adalah kiasan untuk margin.
Sudah pahamkan apa perbedaan padding dengan margin, jika belum paham silahkan dibaca lagi dari awal. Jika kurang jelas, bisa dilihat pada bagian demo.
Dari Penjelasan diatas pasti anda sudah bisa memahami apa perbedaan padding dengan margin. Mari kita bahas lebih detail biar nantinya setelah membaca artikel ini anda tambah pinter dalam hal css, silahkan pelajari contoh di bawah ini.

Contoh Penggunaan CSS Padding

<div style="padding:12px;">...</div>

Contoh Penggunaan CSS Margin

<div style="background:blue;margin:20px">margin:20px</div>
<div style="background:green;margin:20px">margin:20px</div>