Warum funktioniert die Inline-Block-Anzeige in Internet Explorer 8 nicht?-CSS-Tutorial-php.cn

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

Mary-Kate Olsen

Freigeben： 2024-10-31 23:01:29

Original

604 Leute haben es durchsucht

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">

Nach dem Login kopieren

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>

Nach dem Login kopieren

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

Nach dem Login kopieren

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!