Wie kann ich das Kompatibilitätsproblem „display: inline-block;' in IE7 beheben?

IE7 Display: Inline-Block-Kompatibilitätsfix

IE7 stellt eine Herausforderung dar, wenn es um die Implementierung von display: inline-block; Eigentum. Dieser Artikel befasst sich mit dem Problem und bietet eine Lösung.

Für andere Elemente als die natürlichen Inline-Elemente erfordert IE7 einen speziellen CSS-Hack, um Inline-Block-Verhalten zu erreichen. Das folgende CSS erledigt den Zweck:

display: inline-block;
*display: inline;
zoom: 1;

Dieser Hack enthält drei Komponenten:

• display: inline-block: Dies ist die gezielte Anzeigeeigenschaft .
• *display: inline: Dieser Star-Property-Hack stellt sicher, dass die Anzeige in IE7 auf Inline eingestellt ist und unten.
• Zoom: 1: Dies löst das HasLayout-Verhalten aus, das für die ordnungsgemäße Funktion von Inline-Block in IE7 unerlässlich ist.

Beachten Sie, dass dieses CSS möglicherweise Dies kann zu Validierungsproblemen und potenziellen Stilinkonsistenzen führen. Erwägen Sie daher die Verwendung eines IE7-spezifischen Stylesheets durch bedingte Kommentare:

<!--[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]-->

Durch die Implementierung dieses Hacks können Sie den display: inline-block; Beheben Sie die Kompatibilitätsbeschränkung in IE7 und stellen Sie eine konsistente Darstellung Ihrer Webseite in verschiedenen Browsern sicher.

Das obige ist der detaillierte Inhalt vonWie kann ich das Kompatibilitätsproblem „display: inline-block;' in IE7 beheben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!