Tata letak halaman web CSS sulit untuk dikatakan, tetapi sebenarnya sangat sederhana. Dikatakan mudah, namun seringkali banyak masalah yang menyusahkan pemula. Ada banyak teknik yang diperkenalkan di http://www.knowsky.com/article.asp?typeid=38 . Tips dan pengetahuan ini dapat membantu semua orang mendapatkan dua kali lipat hasilnya dengan setengah usaha. Namun, seringkali kita direpotkan oleh beberapa masalah kecil dan tidak bisa bersantai. Hari ini saya ingin memperkenalkan kepada Anda delapan teknik yang tampaknya sangat berguna.
1. Jika Anda ragu, segera periksa. Jika Anda dapat melakukan pemeriksaan sederhana pada kode asli ketika terjadi kesalahan, Anda dapat menghemat banyak sakit kepala. W3C memiliki alat pendeteksi yang tersedia untuk XHTML dan CSS, silakan lihat http://validator.w3.org . Harap dicatat bahwa kesalahan di awal file dapat menyebabkan lebih banyak kesalahan karena struktur yang tidak tepat dan faktor lainnya; kami menyarankan untuk memperbaiki beberapa kesalahan yang paling jelas terlebih dahulu dan kemudian memeriksa ulang, yang dapat mengurangi jumlah kesalahan.
2. Saat menggunakan fungsi mengambang, ingatlah untuk menghapus perintah dengan benar. Mengambang adalah fungsi yang berbahaya dan mungkin tidak memberikan hasil yang Anda harapkan. Jika Anda menemukan elemen mengambang yang melampaui batas wadah di sekitarnya atau situasi tidak biasa lainnya, pastikan Anda melakukannya dengan benar.
3. Gunakan bantalan atau pembatas saat pembatas tumpang tindih untuk mencegah Anda mengkhawatirkan sedikit ruang yang seharusnya tidak ada, atau saat Anda membutuhkan sedikit ruang, Anda tidak dapat memerasnya apa pun yang terjadi. Jika Anda menggunakan margin, batasnya akan mudah tumpang tindih.
4. Cobalah untuk menghindari menentukan padding/batas dan tinggi atau lebar untuk elemen secara bersamaan. IE versi Windows sering menyebabkan masalah perhitungan dengan lebar dan tinggi. Ada beberapa cara untuk mengatasi masalah ini, tetapi jika elemen induk perlu menentukan tinggi dan lebar, yang terbaik adalah menerapkan margin ke elemen anak di dalam elemen induk, atau ketika elemen anak perlu menentukan tinggi dan lebar, terapkan padding ke elemen induk untuk mencapai Efek ini.
5. Jangan mengandalkan min-width/min-height
IE versi Windows tidak mendukung kedua sintaksis tersebut. Namun sampai batas tertentu, IE versi Windows dapat mencapai efek yang setara dengan min-width/min-height, jadi selama Anda menambahkan beberapa fungsi pemfilteran ke IE, Anda dapat mencapai hasil yang Anda inginkan.
6. Jika ragu, kurangi persentasenya terlebih dahulu. Terkadang beberapa kesalahan akan membuat 50%+50% menjadi 100,1% sehingga menyebabkan masalah pada halaman web. Saat ini coba ubah nilai tersebut menjadi 49% atau bahkan 49,9%.
7. Ingatlah bahwa sintaks singkatan "TRBL" untuk border, margin dan padding memiliki urutan tertentu, dimulai dari atas dan berputar searah jarum jam: atas, kanan, bawah, kiri. Jadi hasil marginnya: 0 1px 3px 5px adalah tidak ada pembatas di bagian atas, 1 piksel di sebelah kanan, dan seterusnya. Ingat "TRBL" dan Anda tidak akan salah urutannya.
8. Selama nilainya tidak nol, maka satuannya harus ditentukan. Hal ini memerlukan perhatian khusus. Banyak teman pemula yang sering mengabaikan masalah ini.