Comment puis-je maintenir la compatibilité FF 33.x Flexbox dans FF 34.x et versions ultérieures ?

Obtention de la compatibilité FF 33.x Flexbox dans FF 34.x

Dans Firefox 34.x, le comportement de Flexbox a subi des modifications. Cela a provoqué la rupture de certaines mises en page auparavant fonctionnelles.

Le problème de taille minimale implicite

La principale différence entre les implémentations de Flexbox FF 33.x et 34.x se concentre sur les mises en œuvre implicites de Flexbox. taille minimale pour les éléments flexibles. Dans FF 34.x, cette fonctionnalité a été réintroduite, ce qui a un impact sur le comportement de la mise en page.

Recréer le comportement de FF 33.x

Pour restaurer le comportement de FF 33.x dans FF 34.x ou 35.x, appliquez cette règle CSS :

* { min-height:0 }

Ceci La règle définit universellement la hauteur minimale à zéro, remplaçant le nouveau comportement par défaut.

Application ciblée

Bien que la règle ci-dessus soit une solution simple, min-height:0 devrait idéalement, être appliqué uniquement aux éléments spécifiques qui en ont besoin. Plus précisément, cette règle doit être appliquée à tout élément qui :

• Est un enfant d'un conteneur flexible orienté colonne
• Contient un grand descendant qui doit pouvoir déborder

Exemple

Par exemple, dans le violon fourni (http://jsfiddle.net/yoL2otcr/1/), min-height:0 a été appliqué pour corriger le problème de débordement.

Informations complémentaires

Pour Pour plus d'informations et des exemples sur ce changement spécifique de spécification Flexbox, reportez-vous au outil de suivi des bogues de Mozilla : 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!