Ada banyak keuntungan menggunakan framework XHTML+CSS, namun memang ada beberapa kendala. Entah karena kurangnya pengalaman atau pemikiran yang tidak jelas, pertama-tama saya akan menuliskan beberapa masalah yang saya temui di bawah ini agar semua orang tidak perlu mencari-cari.
1. Interpretasi model BOX di mozilla firefox dan IE tidak konsisten sehingga menghasilkan perbedaan 2px. Solusi:
div{margin:30px!important;margin:28px;}
Perhatikan urutan kedua margin ini tidak boleh ditulis terbalik, menurut Ajie! Atribut penting tidak dikenali oleh IE, tapi browser lain bisa. Oleh karena itu, sebenarnya diartikan seperti ini di bawah IE:
Jikadiv{maring:30px;margin:28px}
didefinisikan berulang kali, yang terakhir akan dieksekusi, jadi Anda tidak bisa hanya menulis margin:XXpx!important
; IE5 dan IE6 tidak konsisten di bawah IE5. div{width:300px;margin:0 10px 0 10px;}Lebar div akan ditafsirkan sebagai 300px-10px (padding kanan)-10px (padding kiri). div adalah 280px, sedangkan lebar di IE6 dan browser lain dihitung sebagai 300px + 10px (padding kanan) + 10px (padding kiri) = 320px. Saat ini kita dapat melakukan modifikasi berikut:
div{width:300px!important;width /**/:340px;margin:0 10px 0 10px}
Saya kurang paham apa ini /**/, saya hanya tahu IE5 dan firefox Keduanya didukung tetapi IE6 tidak mendukungnya. Jika ada yang memahaminya, beri tahu saya. Terima kasih! :)
3. Tag ul memiliki nilai padding secara default di Mozilla, namun di IE hanya margin yang memiliki nilai, jadi mendefinisikannya terlebih dahulu:
ul{margin:0;padding:0;}
dapat menyelesaikan sebagian besar masalah.
4. Mengenai skrip, atribut bahasa tidak didukung di xhtml1.1 Anda hanya perlu mengubah kodenya menjadi:
Itu saja.
5. Jika kita mengatur arah float dan text-align pada container BOX agar sama:
{float:left;text-align:left;margin:0 0 0 200px;}
kita dapat melakukan modifikasi sebagai berikut:
{float :kiri; perataan teks:kiri;margin:0 0 0 200 piksel;tampilan:sebaris;}