Mengapa Flexbox Saya Tidak Berfungsi dalam Internet Explorer?

Harta Flex Tidak Berfungsi dalam IE

Walaupun penggunaan meluas Flexbox, ia boleh menghadapi had apabila digunakan dalam Internet Explorer (IE). Jika anda mendapati Flexbox tidak berfungsi seperti yang dimaksudkan dalam IE 11, anda patut menyiasat beberapa penyelesaian yang mungkin.

Salah satu isu utama timbul daripada kesukaran IE menghuraikan sifat flex trengkas. Untuk menangani perkara ini, cuba gunakan sifat tangan panjang. Sebagai contoh, bukannya "flex: 0 0 35%;", gunakan "flex-grow: 0; flex-shrink: 0; flex-basis: 35%;".

Satu lagi masalah biasa ialah keperluan untuk membolehkan pengecutan lentur. Dalam kes di mana flex-shrink dilumpuhkan, cuba gunakan nilai 1 dan bukannya 0. Contohnya, tukar "flex: 0 0 35%;" kepada "flex: 0 1 35%;".

Selain itu, berhati-hati apabila menggunakan peratusan atau nilai tanpa unit dengan asas-flex. Tingkah laku IE11 mungkin berbeza bergantung pada variasi yang digunakan. Eksperimen dengan pilihan seperti "flex: 1 1 0", "flex: 1 1 0px" dan "flex: 1 1 0%". Selain itu, ambil perhatian bahawa sesetengah pemendek CSS mungkin menggantikan "0px" dengan "0", yang boleh membawa kepada cabaran penyahpepijatan.

Jika anda menghadapi masalah dengan arah flex, khususnya apabila bertukar dari baris ke lajur dalam pertanyaan media, cuba gunakan "flex: auto" dan bukannya "flex: 1". "flex auto" pada asasnya diterjemahkan kepada "flex-grow: 1; flex-shrink: 1; flex-basis: auto".

Sebagai langkah terakhir, pertimbangkan untuk menggunakan sifat lebar/tinggi konvensional dan bukannya Flexbox. Sebagai alternatif, anda boleh cuba menggunakan susun atur blok dan bukannya susun atur fleksibel. Ini melibatkan menetapkan nilai paparan item flex kepada "display: block" dan bukannya "display: flex; flex-direction: column".

Penyelesaian ini boleh membantu mengurangkan had Flexbox dalam IE 11. Dengan memahami cabaran khusus penyemak imbas, anda boleh melaksanakan Flexbox dengan berkesan merentas pelayar dan platform yang berbeza.

Atas ialah kandungan terperinci Mengapa Flexbox Saya Tidak Berfungsi dalam Internet Explorer?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!