CSS Margin

Sunday, May 24, 2009

CSS Margin

Properti ini (margin) digunakan untuk membuat ruang kosong disekeliling elemen.
Dengan properti margin, kita bisa mengatur sekaligus empat sisi dari sebuah elemen. CSS juga menyediakan properti tersendiri bila kita ingin mengatur masing-masing sisi yaitu:
margin-top
margin-right
margin-bottom
margin-left

Keempat properti diatas, adalah merupakan nilai dari properti margin
sintaks :

p.margin {margin: 2cm 4cm 3cm 4cm}

value (nilai) properti margin terdiri dari 3 macam yaitu :

Value	Keterangan
auto	browser akan mengesetnya secara otomatis
length	lihat kembali CSS Units
%	mendefinisikan margin dalam % dari total lebar atau tinggi dokumen (left, right : % dari total lebar dokumen) (top, bottom : % dari total tinggi dokumen)

Contoh CSS margin

<html>
<head>
<style type="text/css">
p.margin {margin: 4cm 2cm 3cm 1cm}
</head>
<body>
<p>Paragraph dengan margin tidak ditentukan</p>
<p class="margin">Paragraph dengan margin yang ditentukan</p>
<p>Paragraph dengan margin tidak ditentukan</p>
</body>

</html>

Tampilan:

Paragraph dengan margin tidak ditentukan

Paragraph dengan margin yang ditentukan

Paragraph dengan margin tidak ditentukan

Value yang lainnya bisa dicoba sendiri...
Sorry agak pelit nih...