Pemadanan Margin CSS
- Hal Sebelumnya Margin CSS
- Hal Berikutnya Margin Dalam CSS
Penggabungan margin mengacu pada saat dua margin vertikal bertemu, mereka akan membentuk margin.
Tinggi margin setelah penggabungan sama dengan tinggi yang terbesar dari kedua margin yang digabungkan.
Penggabungan margin
Penggabungan margin (penambahan) adalah konsep yang cukup sederhana. Tetapi, dalam praktik mengelola layout halaman web, ini dapat menyebabkan banyak kebingungan.
Dengan kata lain, penggabungan margin mengacu pada saat dua margin vertikal bertemu, mereka akan membentuk margin. Tinggi margin setelah penggabungan sama dengan tinggi yang terbesar dari kedua margin yang digabungkan.
Ketika elemen muncul di atas elemen lain, margin bawah elemen pertama akan digabungkan dengan margin atas elemen kedua. Lihat gambar di bawah ini:
Ketika elemen berada di dalam elemen lain (diperkirakan tanpa margin dalam atau garis pinggir yang memisahkan margin), margin atas dan/atau margin bawah mereka juga akan digabungkan. Lihat gambar di bawah ini:
Walaupun terlihat ganjil, margin bahkan dapat digabungkan dengan diri sendiri.
Diperkirakan ada elemen kosong yang memiliki margin, tetapi tanpa garis pinggir atau isian. Dalam hal ini, margin atas dan margin bawah bertemu bersama-sama dan akan digabungkan:
Jika margin ini bertemu dengan margin elemen lain, penggabungan akan terjadi:
Ini adalah alasan mengapa ruang yang diambil oleh elemen paragraf sangat kecil, karena semua margin mereka digabungkan bersama-sama untuk membentuk margin kecil.
Penggabungan margin terlihat mungkin ganjil, tetapi sebenarnya mempunyai makna. Sebagai contoh, halaman teks tipikal yang terdiri dari beberapa paragraf. Ruang atas pertama paragraf sama dengan margin atas paragraf. Jika tidak terjadi penggabungan margin, margin antara semua paragraf berikutnya akan menjadi jumlah penjumlahan margin atas dan margin bawah yang berdekatan. Ini berarti ruang antara paragraf adalah dua kali ukuran puncak halaman. Jika terjadi penggabungan margin, margin atas dan margin bawah antara paragraf akan digabungkan bersama-sama, sehingga jarak di tempat lainnya akan tetap sama.
Keterangan:Hanya margin vertikal blok dalam alur dokumen biasa yang akan mengalami penggabungan margin. Margin antara blok dalam, blok floating, atau blok absolute tidak akan digabungkan.
Semua Properti Margin CSS
| Atribut | Deskripsi |
|---|---|
| margin | Atribut singkat untuk mengatur atribut margin dalam satu pernyataan. |
| margin-bottom | Tetapkan margin bawah bagi elemen. |
| margin-left | Tetapkan margin kiri bagi elemen. |
| margin-right | Tetapkan margin kanan bagi elemen. |
| margin-top | Tetapkan margin atas bagi elemen. |
- Hal Sebelumnya Margin CSS
- Hal Berikutnya Margin Dalam CSS
