Mengenal Property Margin


Property margin ini digunakan untuk mengatur ruang atau jarak batasan antar elemen, misalnya antara elemen atas dan bawah, atau antara kiri dan bawah. Mirip dengan padding, margin juga merupakan spasi atau ruang kosong di dalam Box Model. Perbedaannya, margin berada di luar konten, yaitu yang membatasi sebuah elemen dengan elemen lain.

Dalam website W3School, margin didefinisikan dengan :

  • The css margin properties are used to generate spae around elements.
  • The margin properties set the sizze of the white space outside the border.
With css, you have full control over the margins. There are css properties for setting the margin for each side of an element(top, right, bottom, and left). CSS has propesties for specifying the margin for each side of an element :

  • margin-top
  • margin-right
  • margin-botton
  • margin-left
All the margin properties can have the following values :
- auto : The browser calculates the margin
- length : specifies a margin in px, pt, cm, etc.
- % : specifies a margin in % of the width of the containing element
- inherit : specifies that the margin should be inherited from the parent element
NB : Negative value are allowed.

Berikut ini propertinya :

  • Margin : Property ini untuk mengatur jarak meliputi secara keseluruhan antar elemen. Untuk menggunakan property bisa menggunakan perintah Selector{margin: auto}, value lain yang bisa digunakan dengan ukuran px, em atau presentase dengan persen (%).
  • Margin-Top : Property ini untuk mengatur jarak top dengan elemen, cara penggunaanya yaitu Selector{margin-top: auto}, value lain bisa dengan ukuran  px, em atau dengan presentase misalnya 25%.
  • Margin-Left : Property ini untuk mengatur jarak left (kiri) dengan elemen, cara menggunakan Selector{margin-left: auto}, value lainnya bisa dengan ukuran px, em atau bisa dengan presentase misal 25%.
  • Margin-Right : Property ini untuk mengatur jarak right dengan elemen. Cara penggunaanya Selector{margin-right: auto}, value lain yang bisa untuk digunakan adalah ukuran px, em atau dengan persen, contoh 25%.
  • Margin-Bottom : Property ini digunakan untuk mengatur jarak bottom dengan elemen. Cara penggunaannya yaitu, Selector{margin-bottom: auto}value lain yang bisa untuk digunakan adalah ukuran px, em atau dengan persen, contoh 25%.
Itulah property margin serta value-nya, selamat belajar....
Salam semangat.....
Ahmad Istakim

Alumni dari jurusan Manajemen Informatika di Universitas Sains Al-Qur'an (UNSIQ ) Wonosobo. Tertarik dalam bidang pendidikan, teknologi komputasi dan disiplin ilmu keislaman ( Tafsir, Hadits, Arudl, Nahwu-Sharaf, Fiqh maupun Aqidah ) - https://s.id/blog-islamQ. Pernah juga mengenyam pendidikan di beberapa pesantren yang ada di Kab. Wonosobo dan Kab. Purworejo

Posting Komentar

Lebih baru Lebih lama