Warum funktioniert Inline-Block in IE8 nicht richtig?-CSS-Tutorial-php.cn

Warum funktioniert Inline-Block in IE8 nicht richtig?

Susan Sarandon

Freigeben： 2024-10-29 05:59:02

Original

528 Leute haben es durchsucht

Why Doesn't Inline-Block Work Properly in IE8?

IE8-Anzeige: Inline-Block-Fehler behoben

In IE8 stoßen einige Benutzer trotz der offensichtlichen Unterstützung für Inline-Block auf Probleme mit Inline Anzeige. Um dieses Problem zu lösen, stellen Sie sicher, dass vor dem HTML-Tag ein Doctype deklariert wird.

Der folgende Code demonstriert die Verwendung von Inline-Block in IE8:

<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

Dieser Code ist beabsichtigt um die Span- und Listenelemente inline auszurichten, wie in Browsern wie Google Chrome zu sehen ist. Allerdings kann es bei IE8-Benutzern aufgrund des Fehlens eines Doctypes zu einer falschen Ausrichtung kommen. Um eine ordnungsgemäße Anzeige in IE8 sicherzustellen, fügen Sie die folgende Deklaration als erste Zeile Ihres Codes hinzu:

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

Nach dem Login kopieren

Dieser Dokumenttyp informiert IE8 darüber, dass das Dokument dem HTML5-Standard entspricht, löst das Anzeigeproblem und richtet die Elemente korrekt aus wie beabsichtigt.

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