Mengatur Margin dengan CSS

Properti Margin pada CSS berfungsi untuk mengatur  batas antara border dengan sisi selector pada sebuah elemen.
Cara penulisan properti margin, hampir sama dengan cara penulisan properti padding, yaitu:

Tips berikut ini
1.

div#sidebox {margin:10px;}

maksud dari code diatas adalah menunjukan bahwa ke empat sisi dari selector sidebox bejarak 10 pixel antara border dan sisi selector.
2.

div#sidebox {margin:10px 20px;}

maksud dari code diatas adalah menunjukan bahwa batas atas dan bawah dari selector sidebox bejarak 10 pixel sedangkan batas kiri dan kanan berjarak 20 pixel.
3.

div#sidebox {margin:10px 20px 30px 40px;}

atau bisa juga dengan cara seperti dibawah ini:

div#sidebox {margin-top:10px; margin-right:20px;
margin-bottom:30px; margin-left:40px;}

maksud dari code diatas adalah menunjukan bahwa batas atas dari selector sidebox bejarak 10 pixel, batas kanan berjarak 20 pixel, batas bawah berjarak 30px dan batas kiri berjarak 40px.
4.

div#sidebox {margin-top:10px;}

maksud dari code diatas adalah menunjukan bahwa batas atas dari selector sidebox bejarak 10 pixel sedangkan batas yang lainnya bernilai Default. Dan selain margin-top, juga bisa dengan properti margin-right, margin-bottom dan margin-left.
Selain dengan satuan px (pixel) juga bisa dengan satuan emphasis (em) atau persentase (%), seperti contoh:

div#sidebox {margin:1em 2%;}

Hasil Tutorial nya ?…
anda bisa melakukan eksperimen sendiri kemudian test pada browser anda. dengan cara demikian akan membuat permainan anda semakin menantang.

Artikel terkait :