Comment puis-je reproduire le comportement de Firefox 33.x Flexbox dans les versions ultérieures ?

Réplication du comportement de FF 33.x Flexbox dans FF 34.x et au-delà

L'implémentation de flexbox dans Firefox 34 et versions ultérieures introduit une nouvelle fonctionnalité connue sous le nom de « taille minimale implicite des éléments flexibles ». Ce changement entraîne la croissance des éléments des conteneurs flexbox au-delà de la fenêtre d'affichage, perturbant les présentations précédentes. Les utilisateurs qui utilisent flexbox pour les applications de bureau peuvent rencontrer ce problème.

Pour restaurer le comportement d'origine de FF 33.x, une règle de style simple peut être ajoutée : * { min-height : 0 ; }. Cette ligne fixe la hauteur minimale de tous les éléments à zéro, les empêchant de dépasser la hauteur de leur conteneur.

Cependant, dans certains cas, il peut être nécessaire d'appliquer min-height:0 uniquement à des éléments spécifiques. Cela s'applique aux éléments qui :

• Sont des enfants de conteneurs flexbox verticaux
• Contient de grands descendants destinés à déborder

Dans la question d'origine, le le problème de disposition provient d'un élément de grande taille imbriqué dans plusieurs conteneurs flexibles. Pour résoudre ce problème, min-height:0 doit être défini pour tous les éléments le long de la chaîne d'imbrication.

Notez que ce changement de spécification a provoqué des ruptures de mise en page généralisées sur le Web. Le rapport de bug fournit des détails et des exemples supplémentaires : https://bugzilla.mozilla.org/show_bug.cgi?id=1043520

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!