Mengapa Sekatan Sebaris Tidak Berfungsi dalam Internet Explorer 6 dan 7, dan Bagaimana Saya Boleh Membetulkannya?

Masalah Blok Sebaris dalam Internet Explorer 6 dan 7

Konsep blok sebaris dalam CSS membolehkan elemen berfungsi sebagai sebaris dan sekatan -elemen peringkat serentak. Walau bagaimanapun, jika anda menghadapi masalah dengan blok sebaris tidak berfungsi dalam Internet Explorer 6 dan 7, anda tidak bersendirian.

Masalahnya:

Secara lalai , inline-block hanya berfungsi pada elemen inline inline, seperti span. Menggunakannya pada elemen lain seperti div dalam IE6 dan IE7 boleh membawa kepada tingkah laku yang tidak dapat diramalkan.

Penyelesaian:

Untuk menyelesaikan isu ini dan mendayakan sekatan sebaris pada bukan- elemen sebaris dalam IE6/7, anda perlu menggunakan penyelesaian. Ini melibatkan penambahan CSS berikut:

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

Berikut ialah pecahan penyelesaian:

• *paparan: sebaris ialah penggodaman CSS "selamat" yang menyasarkan IE7 dan lebih rendah. Ia mengatasi sifat paparan yang ditetapkan oleh blok sebaris.
• zum: 1 memaksa IE6/7 untuk menggunakan "reka letak" pada elemen. Reka letak adalah penting untuk blok sebaris berfungsi secara konsisten.

Pertimbangan Tambahan:

Mungkin untuk melaksanakan penyelesaian ini sambil mengekalkan CSS yang sah, tetapi biasanya tidak disyorkan, terutamanya jika anda sudah menggunakan awalan khusus vendor lain.

Untuk maklumat lanjut cerapan pada paparan: inline-block, rujuk sumber luaran, tetapi ambil perhatian bahawa -moz-inline-stack tidak lagi diperlukan kerana ia hanya digunakan pada Firefox 2.

Atas ialah kandungan terperinci Mengapa Sekatan Sebaris Tidak Berfungsi dalam Internet Explorer 6 dan 7, dan Bagaimana Saya Boleh Membetulkannya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!