Wie kann ich dafür sorgen, dass „display: inline-block' in Internet Explorer 6 und 7 ordnungsgemäß funktioniert?

Inline-Block-Dilemma in Internet Explorer 6 und 7

Trotz seiner breiten Akzeptanz funktioniert Inline-Block nicht gut mit Internet Explorer 6 und 7. Diese Eigenart kann Ihre Bemühungen behindern, Inline-Block effektiv für Seitenlayouts zu verwenden.

Der Grund dafür Das Verhalten liegt darin begründet, dass inline-block in IE6/IE7 nur bei inhärenten Inline-Elementen wie Spans korrekt funktioniert. Um seine Reichweite auf Elemente wie Divs auszudehnen, ist eine Problemumgehung erforderlich.

Die Herausforderung meistern

Damit Inline-Block mit Divs und anderen Elementen auf Blockebene funktioniert IE6/IE7, verwenden Sie das folgende CSS-Snippet:

#signup {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

Breaking Down the Lösung

1. display: inline-block: Deklariert das Inline-Block-Verhalten.
2. *display: inline: A " sicherer“ CSS-Hack, der auf IE7 und niedriger abzielt und Inline-Verhalten erzwingt.
3. Zoom: 1: Stellt „Layout“ für Elemente auf Blockebene bereit, was für die Funktion von Inline-Block in IE6/IE7 von entscheidender Bedeutung ist.

Zusätzliche Informationen

Während es möglich ist, bei der Anwendung dieser Problemumgehung gültiges CSS zu erreichen, ist dies nicht praktikabel, insbesondere wenn vom Hersteller vorgegebene Eigenschaften verwendet werden an anderer Stelle.

Ein umfassenderes Verständnis von display: inline-block finden Sie in den entsprechenden Ressourcen, mit Ausnahme von -moz-inline-stack, das nur für Firefox 2 gilt.

Das obige ist der detaillierte Inhalt vonWie kann ich dafür sorgen, dass „display: inline-block' in Internet Explorer 6 und 7 ordnungsgemäß funktioniert?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!