Haii… kali ini saya akan berbagi sedikit ilmu tentang margin dan padding. Dua sejoli ini terkadang yang masih membingungkan kita dalam melakukan coding, ya? Apa itu margin? Margin merupakan batas sebuah objek dengan objek lain. Pada halaman kosong, saat kita membuat sebuah objek, margin berarti batas antara objek dengan background.

Lihat gambar

script untuk gambar di atas sebagai berikut

buat nama file kotak.php dan tulis script berikut jangan lupa disimpan di folder C:\xampp\htdocs

Kemudian, buat file baru dengan nama style.css pada folder yang sama, seperti yang sudah dideklarasikan pada gambar di atas.

Berikut scriptnya :

Sedangkan padding merupakan batas antara tulisan dengan background atau bingkai. Dengan kata lain, padding merupakan script untuk mengatur jarak antara tulisan dengan bingkai.

Lihat gambar

Scriptnya sama seperti pada gambar sebelumnya ya, teks kita letakkan di dalam  <div> seperti berikut

kemudian ubah file cssnya menjadi seperti berikut:

Dalam format penulisannya, biasanya pengaturan margin dan padding ditulis sebanyak empat kali. Misalnya pada gambar di atas,

Margin : 30px  30px  30px 30px;

30 px yang pertama adalah untuk top (batas atas)

30 px kedua adalah untuk bottom (batas bawah)

30 px ketiga adalah untuk right (batas kanan)

30 px keempat adalah untuk left (batas kiri)