margin-left
Properti CSS margin-left digunakan untuk menentukan lebar area kiri kotak margin elemen.
Jadi, properti ini menentukan area ruang yang diperlukan di bagian kiri 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.
Properti margin-left tidak berpengaruh pada elemen inline yang tidak diganti. Periksa artikel tentang
display untuk detail tentang elemen inline dan lainnya.
CSS Syntax
margin-left: length | auto | initial | inherit;
JavaScript Syntax
object.style.marginLeft="100px"
| Default value: | 0 |
|---|---|
| Inherited: | tidak |
| Animatable: | ya Read about animatable |
| Version: | CSS1 |
Attribute Value
default
margin-left: 0;
margin-left: 50px;
margin-left: 7em;
Kamu dapat menggunakan nilai (r)em.
Nilai ini relatif terhadap ukuran font:
- em: relatif terhadap ukuran font elemen saat ini
- rem: relatif terhadap
<html>ukuran font elemen root
margin-left: 30%;
Kamu dapat menggunakan nilai persentase.
Persentase didasarkan pada lebar wadah.
margin-left: auto;
Kata kunci auto akan memberikan bagian kiri ruang tersisa.
Ketika dikombinasikan dengan margin-right: auto, itu akan memusatkan elemen, jika lebar tetap didefinisikan.