CSS Margin

Pada CSS (Cascading Style Sheets), properti margin menentukan space kosong di sekeliling suatu element. Dengan menggunakan margin, area di sekeliling suatu element di luar border menjadi kosong. Margin tidak memiliki background-color, jadi selalu transparan.

Margin atas, bawah, kanan, kiri dapat di set secara individual menggunakan properti nya masing-masing. Semua margin dapat juga di gabung dalam 1 properti, ini dinamakan shorthand margin property.

Value pada suatu margin dapat di set sebagai berikut:

Value	Description
auto	The browser sets the margin. The result of this is dependant of the browser
length	Defines a fixed margin (in pixels, pt, em, etc.)
%	Defines a margin in % of the containing element

Kita bisa menggunakan nilai negatif pada margin, ini menyebabkan content masuk ke dalam element.

Margin - Individual sides
Berikut ini cara membuat mergin dengan menentukan batas atas, bawah, kanan, kiri secara individual.

margin-top:100px; margin-bottom:100px; margin-right:50px; margin-left:50px;

Margin - Shorthand property
Untuk memperpendek code, semua margin bisa dibuat dalam 1 buah property. Berikut ini adalah cara penulisan shorthand property pada margin.

• margin:25px 50px 75px 100px;
  • top margin is 25px
  • right margin is 50px
  • bottom margin is 75px
  • left margin is 100px
  
  
• margin:25px 50px 75px;
  • top margin is 25px
  • right and left margins are 50px
  • bottom margin is 75px
  
  
• margin:25px 50px;
  • top and bottom margins are 25px
  • right and left margins are 50px
  
  
• margin:25px;
  • all four margins are 25px

http://blog.aerje.com