Saat melakukan penyusunan huruf DIV+CSS pada halaman, masalah kelebihan spasi di bawah elemen gambar img di IE6 (tentu saja, terkadang di Firefox) adalah hal yang lumrah telinga", solusi yang berbeda perlu digunakan tergantung pada alasannya. Di sini kami secara langsung merangkum metode umum untuk mengatasi BUG celah berlebih di bawah tata letak gambar untuk referensi Anda.
1. Ubah gambar menjadi objek tingkat blok
dengan mengatur img ke "display:block;". Dalam contoh ini tambahkan satu set kode CSS: "#sub img {display:block;}".
2. Mengatur perataan vertikal gambar,
yaitu mengatur atribut perataan vertikal gambar menjadi "atas, teks-atas, bawah, teks-bawah" juga dapat diselesaikan. Misalnya, dalam contoh ini, tambahkan sekumpulan kode CSS: "#sub img {vertical-align:top;}".
3. Atur ukuran teks objek induk menjadi 0px,
yaitu tambahkan baris di #sub: "font-size:0;" untuk menyelesaikan masalah. Namun hal ini juga menimbulkan masalah baru, teks pada objek induk tidak dapat ditampilkan. Meskipun bagian teks diapit oleh sub-objek, tetap dapat ditampilkan dengan mengatur ukuran teks sub-objek, namun pesan kesalahan bahwa teks terlalu kecil akan diminta selama validasi CSS.
4. Ubah properti objek induk.
Jika lebar dan tinggi objek induk tetap dan ukuran gambar bergantung pada objek induk, Anda dapat mengatur "overflow:hidden;" untuk menyelesaikan masalah. Misalnya, dalam contoh ini, Anda dapat menambahkan kode berikut ke #sub: "width:88px;height:31px;overflow:hidden;".
5. Untuk mengatur atribut floating pada gambar
, tambahkan sebaris kode CSS pada contoh ini: "#sub img {float:left;}". Jika Anda ingin mendapatkan susunan campuran antara gambar dan teks, metode ini adalah pilihan yang baik.
6. Hilangkan spasi antara tag gambar dan tag penutup terakhir objek induknya.
Perlu ditekankan bahwa metode ini dapat menimbulkan masalah dalam pengembangan sebenarnya, karena untuk membuat kode lebih semantik dan jelas saat menulis kode, tidak dapat dihindari untuk menyediakan tampilan lekukan kode melalui IDE, yang pasti akan membuat label dan label lainnya Tampilan jeda baris, seperti perintah "Terapkan Format Sumber" DW. Oleh karena itu, metode ini dapat membantu kita memahami situasi dimana terjadi BUG. Solusi spesifik harus diselesaikan oleh semua orang.