Bagaimana Saya Boleh Mengekalkan Keserasian Flexbox FF 33.x dalam FF 34.x dan Kemudian?

Mencapai FF 33.x Keserasian Flexbox dalam FF 34.x

Dalam Firefox 34.x, tingkah laku Flexbox telah mengalami pengubahsuaian. Ini telah menyebabkan beberapa reka letak berfungsi sebelum ini rosak.

Isu Saiz Minimum Tersirat

Percanggahan utama antara pelaksanaan FF 33.x dan 34.x Flexbox tertumpu pada tersirat saiz minimum untuk item flex. Dalam FF 34.x, ciri ini telah diperkenalkan semula, memberi kesan kepada tingkah laku reka letak.

Mencipta semula FF 33.x Gelagat

Untuk memulihkan gelagat FF 33.x dalam FF 34.x atau 35.x, gunakan CSS ini peraturan:

* { min-height:0 }

Peraturan ini secara universal menetapkan ketinggian minimum kepada sifar, mengatasi tingkah laku lalai baharu.

Aplikasi Sasaran

Sementara perkara di atas peraturan ialah penyelesaian yang mudah, min-height:0 sebaiknya digunakan hanya pada elemen tertentu yang memerlukannya. Khususnya, peraturan ini perlu digunakan pada mana-mana elemen yang:

• Merupakan anak bekas lentur berorientasikan lajur
• Mengandungi keturunan tinggi yang sepatutnya dibiarkan melimpah

Contoh

Sebagai contoh, dalam biola yang disediakan (http://jsfiddle.net/yoL2otcr/1/), min-height:0 telah digunakan untuk membetulkan isu limpahan.

Maklumat Lanjut

Untuk maklumat tambahan dan contoh tentang perubahan spesifikasi Flexbox khusus ini, rujuk kepada penjejak pepijat Mozilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1043520

Atas ialah kandungan terperinci Bagaimana Saya Boleh Mengekalkan Keserasian Flexbox FF 33.x dalam FF 34.x dan Kemudian?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!