Heim > Artikel > Web-Frontend > Warum funktioniert die Inline-Block-Anzeige in Internet Explorer 8 nicht?

Warum funktioniert die Inline-Block-Anzeige in Internet Explorer 8 nicht?

Mary-Kate OlsenOriginal: 2024-10-31 23:01:29606Durchsuche

Why is Inline-Block Display Not Working in Internet Explorer 8?

Anhaltende Inline-Block-Probleme in Internet Explorer 8

Obwohl in der Dokumentation darauf hingewiesen wird, dass Inline-Block unterstützt wird, kann es in Internet Explorer 8 möglicherweise nicht richtig gerendert werden. Dieses Problem tritt häufig auf manifestiert sich, wenn versucht wird, Elemente horizontal auszurichten.

Um dieses Problem zu beheben, beachten Sie Folgendes:

Stellen Sie den richtigen Doctype ein

Starten Sie Ihr HTML-Dokument mit der folgenden Doctype-Deklaration:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Dadurch wird sichergestellt, dass IE8 die korrekten Rendering-Spezifikationen einhält.

Codebeispiel

Berücksichtigen Sie den folgenden CSS- und HTML-Code:

<code class="css">span, ul, ul li {
    display: inline-block;
    vertical-align: top;
    margin: 0;
    padding: 0;
    list-style: none;
}   </code>

<code class="html"><span>i would want</span>
<ul>
  <li>this</li>
  <li>on</li>
  <li>one line.</li>
</ul></code>

Wenn die Doctype-Deklaration vorhanden ist, sollte dieser Code wie erwartet inline in IE8 gerendert werden.

Fazit

Das Hinzufügen der richtigen Doctype-Deklaration ist für die Lösung von Inline-Block-Rendering-Problemen im Internet Explorer unerlässlich 8. Diese einfache Anpassung stellt sicher, dass der Browser CSS-Stile wie vorgesehen interpretiert und anwendet.

Das obige ist der detaillierte Inhalt vonWarum funktioniert die Inline-Block-Anzeige in Internet Explorer 8 nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

css html for this display issue

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 kann man in CSS ein Hintergrundbild verwischen, ohne den Vordergrundinhalt zu beeinträchtigen?Nächster Artikel：Wie kann man in CSS ein Hintergrundbild verwischen, ohne den Vordergrundinhalt zu beeinträchtigen?

In Verbindung stehende Artikel

Mehr sehen