Warum bleibt ein absolut positioniertes Flex-Element im normalen Fluss in IE11?

Absolut positioniertes Flex-Element bleibt im normalen Fluss in IE11

In einem Flexbox-Layout mit drei Divs, zwei enthalten Inhalt und eines ist absolut positioniert Als Hintergrund behandelt IE11 das absolut positionierte Div als Teil des normalen Flusses und verteilt den Platz zwischen den Divs entsprechend. Dieses Verhalten weicht von den Standards ab und kann zu einer Fehlausrichtung führen.

Problemumgehung:

Firefox hat dieses Problem in Version 52 behoben und an die Flexbox-Spezifikation angepasst. Allerdings bleibt IE11 problematisch. Um dieses Problem zu beheben:

• Positionieren Sie das absolut positionierte Element neu: Anstatt das absolut positionierte Div (.bg) am Ende zu platzieren, verschieben Sie es zwischen die anderen beiden (.c1 und .c2). Dadurch wird die Flussreihenfolge geändert und das absolut positionierte Element effektiv aus dem normalen Fluss entfernt.

Hier ist der aktualisierte HTML-Code:

<div class="container">
    <div class="c1">Content 1</div>
    <div class="bg">Background</div>
    <div class="c2">Content 2</div>
</div>

Das obige ist der detaillierte Inhalt vonWarum bleibt ein absolut positioniertes Flex-Element im normalen Fluss in IE11?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!