margin-bottom

Properti CSS margin-bottom digunakan untuk menentukan lebar area bawah kotak margin elemen.

Jadi, properti ini menentukan area ruang yang diperlukan di bagian bawah elemen, di luar batas yang ditentukan.

Setiap elemen pada halaman web adalah persegi panjang.

Dan setiap elemen memiliki model kotak persegi panjang yang menggambarkan area yang di hasilkan untuk elemen, yaitu: content box, padding box, border-box, dan margin box.

Content box ada pada setiap elemen. Sedangkan padding, border, dan margin box merupakan opsional yang keberadaannya tergantung pada layout desain halaman web yang dibuat oleh web developer.

Model kotak elemen dalam CSS — termasuk area konten, padding, border, dan margin

Model kotak elemen dalam CSS — termasuk area konten, padding, border, dan margin.

Properti margin-bottom tidak berpengaruh pada elemen inline yang tidak diganti. Periksa artikel tentang display untuk detail tentang elemen inline dan lainnya.

CSS Syntax

margin-bottom: length | auto | initial | inherit;

JavaScript Syntax

object.style.marginBottom="100px"
Default value:0
Inherited:tidak
Animatable:ya Read about animatable
Version:CSS1

Attribute Value

default margin-bottom: 0;

Menghapus semua margin di bagian bawah.

margin-bottom: 30px;

Kamu dapat menggunakan nilai piksel.

margin-bottom: 2em;

Kamu dapat menggunakan (r)em.

Nilai ini relatif terhadap ukuran font:

  • em: relatif terhadap ukuran font elemen saat ini
  • rem: relatif terhadapukuran font elemen root

margin-bottom: 10%;

Kamu dapat menggunakan nilai persentase.

Persentase didasarkan pada lebar wadah.