DIV-Tags mit einer relativen Höhe von 100 % werden in Internet Explorer nicht geändert

  • Artikel
  • 2 Minuten Lesedauer

Wichtig

Die Internet Explorer 11-Desktopanwendung wird für bestimmte Versionen von Windows 10 eingestellt und ab dem 15. Juni 2022 nicht mehr unterstützt.

Sie können mit dem Internet Explorer-Modus in Microsoft Edge weiterhin auf ältere Websites zugreifen, für die Internet Explorer erforderlich ist. Anleitung.

Die Internet Explorer 11-Desktopanwendung wird schrittweise an den schnelleren, sichereren Microsoft Edge-Browser umgeleitet und letztendlich über Windows Update deaktiviert werden. Deaktivieren von IE heute.

In diesem Artikel wird ein Entwurfsverhalten eingeführt, bei dem die Größe eines DIV-Tags mit einer relativen Höhe von 100 % in Internet Explorer 9 oder höher nicht geändert wird.

Ursprüngliche Produktversion:   Internet Explorer 9 und höhere Versionen
Ursprüngliche KB-Nummer:   2674902

Problembeschreibung

In Internet Explorer 9 oder einer neueren Version verwenden Sie eine Tabelle mit absoluter Höhe und mindestens zwei Zellen in einer Zeile. Eine Zelle enthält Text und die andere Zelle ein DIV-Tag mit einer relativen Höhe von 100 %. Der Text passt nicht in die angegebene Höhe, daher wird die Größe der Tabelle geändert. Das DIV-Tag bleibt auf der anfänglichen absoluten Höhe der Tabelle und wird nicht automatisch geändert.

Weitere Informationen

Dieses Verhalten ist beabsichtigt und gilt für alle unterstützten Versionen von Internet Explorer 9 und neueren Versionen im Standardmodus.

Hinweis

Das Verhalten kann im Quirksmodus und in der Quirksmodusemulation (QME) bei Verwendung von Internet Explorer 9 oder einer neueren Version unterschiedlich sein.

Nachfolgend sehen Sie ein Beispiel für das oben beschriebene Verhalten:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <body>
        <table style="height:50px;" border="1px">
            <tr>
                <td style="height:100%">
                    <p>
                        this text does not fit and will resize the table<br />this text does not fit and will resize the
                        table<br />
                        this text does not fit and will resize the table<br />this text does not fit and will resize the
                        table<br />
                    </p>
                </td>
                <td style="height:100%; width:50px;">
                    <div style="height:100%; border:1px solid red;"></div>
                </td>
            </tr>
        </table>
    </body>
</html>

Gemäß der W3-Spezifikation wird die Höhe des Inhaltsfelds einer Zelle nicht durch die Höhe der Zeile beeinflusst, und jede zusätzliche Höhe sollte in Richtung des Abstands der Zelle gehen. Anschließend sollte das untergeordnete Element der Zelle ihre prozentuale Höhe im Inhaltsfeld der Zelle auflösen, das durch die Höhe der Zeile unverändert bleibt.

Gemäß CSS 2.1ist die Höhe eines Zellenfelds die mindeste Höhe, die für den Inhalt erforderlich ist. Die Eigenschaft der Tabellenzelle height kann die Höhe der Zeile beeinflussen (siehe oben), die Höhe des Zellenfelds wird jedoch nicht erhöht. Zellenfelder, die kleiner als die Höhe der Zeile sind, erhalten zusätzlichen oberen oder unteren Abstand.

Weitere Informationen finden Sie unter Definieren der Dokumentkompatibilität.