suchen

Heim >Web-Frontend >CSS-Tutorial >Warum wird das Flexbox-Layout in modernen Browsern nicht unterstützt?

Warum wird das Flexbox-Layout in modernen Browsern nicht unterstützt?

Patricia Arquette
Patricia ArquetteOriginal
2024-12-18 10:13:10151Durchsuche

Why Doesn't `` Support Flexbox Layout in Modern Browsers?

Warum funktioniert

nicht? Flex-Layout unterstützen?

In CSS ist das

Element wird als Sonderfall behandelt, wenn es um das Flex-Layout geht. Trotz der Bemühungen, es mit display:flex oder display:inline-flex zu formatieren, verhält es sich wie ein Block- bzw. Inline-Block-Element.

Dieses Verhalten verwirrt einige Entwickler, die unerwartete Ergebnisse in Browsern wie Firefox und Chrome beobachten , finde aber, dass es im Internet Explorer verwirrend funktioniert. Ist das ein Fehler oder beabsichtigtes Verhalten?

Die Erklärung

Laut Fehlerberichten (Bug 984869 und Bug 1047590) ist

zusammen mit – weist ein besonderes Rendering-Verhalten auf. Browser wie Chrome und Firefox implementieren diese Elemente nicht rein in CSS, sodass sie sich aus CSS-Sicht wie Blackboxen verhalten.

Das bedeutet, dass sie nicht immer wie andere nicht-spezielle Elementtypen reagieren, z als

. Beispielsweise werden Bildlaufleisten nicht auf einer angezeigt. mit overflow: scroll, noch wird es als Tabelle mit display: table gerendert.

In ähnlicher Weise wird für

der Flex-Anzeigemodus ignoriert. Dieses Verhalten stimmt mit Internet Explorer überein, der sich weigert, das Flex-Layout auf
anzuwenden. auch.

Die Lösung

Um zuverlässig ein bestimmtes Layout innerhalb eines

Browserübergreifend ist die effektivste Lösung die Verwendung eines Wrappers
innerhalb des
selbst. Dieser Ansatz ähnelt dem, der für erforderlich ist. und
in anderen Browsern.

Das obige ist der detaillierte Inhalt vonWarum wird das Flexbox-Layout in modernen Browsern nicht unterstützt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

firefox css chrome for this display overflow flex table bug Other
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Wie verwende ich prozentualen Abstand oder Rand basierend auf der Höhe des übergeordneten Containers in CSS?Nächster Artikel：Wie verwende ich prozentualen Abstand oder Rand basierend auf der Höhe des übergeordneten Containers in CSS?

In Verbindung stehende Artikel

Mehr sehen