Atribut column-gap CSS
- Halaman sebelumnya column-fill
- Halaman berikutnya column-rule
Definisi dan penggunaan
Atribut column-gap menentukan jarak antara kolom.
Catatan:Jika diatur jarak antara kolom column-ruleini akan ditampilkan di tengah jarak.
Lihat pula:
Panduan pelajaran CSS3:Banyak kolom CSS3
Panduan referensi HTML DOM:Atribut columnGap
Contoh
Tentukan jarak antara kolom 40 pixel:
div { column-gap: 40px; }
Ada banyak contoh lainnya di bawah halaman.
Syntaks CSS
column-gap: length|normal;
Nilai atribut
Nilai | Deskripsi | Pengujian |
---|---|---|
length | Atur jarak antara kolom ke panjang yang ditentukan. | Pengujian |
normal | Tentukan jarak antara kolom sebagai jarak biasa. Nilai yang disarankan W3C adalah 1em. | Pengujian |
Detil teknis
Nilai default: | normal |
---|---|
Inheritance: | no |
Versi: | CSS3 |
Syntaks JavaScript: | object.style.columnGap="40px" |
Contoh lainnya
- Column-count
- Bagikan teks di dalam elemen div ke tiga kolom.
- Column-rule
- Tentukan lebar, gaya, dan warna antara kolom.
Dukungan browser
Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini.
Angka dengan -webkit- atau -moz- menunjukkan versi awal yang menggunakan prefiks.
Atribut | Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
Dalam kolom berbagai | 50 | 10 | 52 | 10 | 37 |
Dalam grid | 66 | 16 | 61 | 12 | 53 |
Dalam kotak elastic | 84 | 84 | 63 | 14.1 | 70 |
- Halaman sebelumnya column-fill
- Halaman berikutnya column-rule