Quirks-Mode – Info

zur IE-Übersicht

Da es in der Anfangszeit des Web so viele aus CSS-Sicht kaputte Seiten gab und sich bei den IE-Versionen 5.x die Webdesigner an den Box-Modell-Fehler gewöhnt hatten, wollten die Browserhersteller nicht eine unerwünschte Darstellung von alten Webseiten verursachen, indem sie ihren neusten Browser jeweils alle Seiten nach denselben kriterien anzeigen lassen (also insbesondere: alte Webseiten nach neuen Regeln). Deshalb haben die meisten Browser eine Art Kompatibilitätsmodus (Quirks-Mode), in dem er sich wie ein alter Browser verhält.

Diese Unterscheidung wird anhand einer Kennung vorgenommen, die beschreibt, in welcher Version von (X)HTML die jeweilige Datei verfasst ist. SGML (quasi das Gerüst für alle HTML-Versionen) und XML (eine für Datenspeicherung optimierte Variante von SGML, auf der insbesondere XHTML basiert) sehen so eine Dokumententyp-Deklaration vor. Allerdings hat sich bei alten HTML-Versionen niemand darum gekümmert, diesen Eintrag vorzunehmen. Dem einleitenden <html> wird typischerweise eine der folgenden Zeilen vorangestellt:

Wenn nun die Browser keine oder eine Deklaration für eine alte HTML-Variante finden, dann schalten sie in den Quirls-Mode. So weit, so gut. Das Problem ist, dass Microsoft mal wieder nicht in der Lage war, einfachste Dinge richtig zu machen. Eine Dokumententyp-Deklaration für eine neue Variante akzeptiert IE 6 sinnloserweise nur in einer sehr engen Form: Die DOCTYPE-Zeile muss die erste in der Datei sein, die html-Zeile die zweite. Und es darf hinter dem DOCTYPE-Tag auch nicht etwa ein SGML-Kommentar (<!-- -->) kommen... Abweichungen von dieser strengen Vorgabe füren zur Umschaltung in den Quirks-Mode für diese Seite. Auf Kommentare an dieser Stelle könnte man noch verzichten, allerdings sollen XHTML-Dokumente mit einem XML-Header versehen werden:

<?xml version="1.0" encoding="UTF-8"?>

Diese Einleitungszeile führt in XHTML-Dokumenten jede saubere CSS-Formatierung ad absurdum. Und auch hier gilt: Dieses Verhalten ist durch nichts zu rechtfertigen. Es ergibt nicht mal einen Sinn, hier "abwärtskompatibel" zu bleiben. Es wäre Microsofts gottverdammte Pflicht gewesen, dieses Problem mit dem ersten Service Pack für IE 6 zu korrigieren. Aber nein, man wollte der Welt wohl mal wieder zeigen, dass man mit Hilfe von Heerschaaren dummer User jeden Schwachsinn durchdrücken kann. IE 7 überlebt immerhin die XML-Zeile, allerdings löst ein Kommentar zwischen dieser und der html-Zeile immer noch den Quirks-Mode aus. Wirklich beeindruckend, wie in diesem Unternehmen programmiert wird.

Codebeispiel

Als Beispiel gibt es diesmal zwei Dateien, die sich aber nur in der ersten Zeile unterscheiden. Der Inhalt ist die Demo des Box-Modell-Fehlers.

Die Einleitungszeilen:

  1. <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

der relevante Inhalt:

<div style="margin:0;padding:0;">
<img src="box.demo.png" alt="Farbverlauf" style="margin:0;vertical-align:bottom;" />
</div>
<p style="width:340px;margin:0;padding:20px;border:10px solid #4345fe;">Hier steht was &ndash; und es sollte in der Breite bitte zum Bild passen.</p>

zur Demo (mit XML-Zeile)

zur Demo (ohne XML-Zeile)