ブラウザ間で「要素」のフレックスボックスの動作が異なるのはなぜですか?

でのフレックスボックスの動作要素

にフレックスボックス スタイルを適用しようとしましたが、

Firefox と Chrome の両方で、

要素の動作はブラウザ間で一貫性がありません。フレックスボックス表示プロパティ (display: flex など) が割り当てられている場合、他のブロックレベル要素とは異なる動作をします。子は水平方向に整列するのではなく、インライン レベルの要素と同様に垂直方向に積み重ねられます。興味深いことに、Internet Explorer は

に対して通常のフレックスボックスの動作を示します。

この動作はバグとはみなされません。 Bug 984869 によると、ボタン要素はその固有の複雑さによりブラウザーで異なる方法で実装され、CSS の実装には制限が課せられます。同様の動作が

でも観察されます。

ただし、Firefox 46 では

に Flexbox を実装することでこの問題に対処しました。これは、Firefox の最近のバージョンでは

がレンダリングされることを意味します。予想されるフレックスボックス動作を持つ要素。古いブラウザや、一貫したブラウザ間互換性が必要なシナリオの場合は、

などのラッパー要素を使用することをお勧めします。 <フィールドセット>内目的のフレックスボックス レイアウトを実現します。

以上がブラウザ間で「要素」のフレックスボックスの動作が異なるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。