Unterschiede der Modi
Die Darstellung innerhalb der Browser ist in vielen Details zum Leidwesen der Wedesigner sehr unterschiedlich.
Hier ist nur eine Auswahl der auffallendsten Unterschiede aufgelistet.
Mozilla ab Version 1.0.1 und Netscape
Seit Version 6.0 basieren Netscape und Mozilla/Firefox auf der gleichen Rendering Engine und verhalten sich identisch, was die Darstellung und das Doctype Switching betrifft.
Netscape 4 hat noch keine Funktionen für das Doctypes Switching eingebaut.
Quirks mode
- Alle Formatierungen werden, wenn nicht anders angegeben, gemäß der Datei quirks.css dargestellt.
- Laut den CSS Richtlinien müssen Farben im RGB Format mit einer Raute (#) beginnen.
In diesem Modus werden sie auch ohne Raute akzeptiert. - Farbwerte in Anführungszeichen werden akzeptiert
- Als Standardeinheit für Zahlen wird Pixel genommen, wobei normalerweise Zahlen immer mit der entsprechenden Einheit angegeben werden müssen.
- Ein leerer String bei der Angabe des Hintergrundbildes wird als leerer Hintergrund gewertet.
- Der Rahmen um Tabellenzellen ist 1 Pixel breit.
- Das Body-Element kann eine Höhe von 100% haben, ohne dass Inhalt vorhanden ist.
Standard Mode
Da sich das W3C nur ungenau über die Darstellung der Line-height Eigenschaft äußert, nutzten die Mozilla Entwickler den gegebenen Spielraum aus und interpretierten die CSS Spezifikation auf ihre Art und Weise. Sehr zum Leidwesen vieler Webdesigner, da die Kombination aus Tabellen und pixelgenauem Design nur umständlich ermöglichte korrekte und browserübergreifende Seiten zu erstellen.
Das Ergebnis war eine schier endlose Debatte, über die korrekte CSS2-Interpretation der line-height Eigenschaft, die der Auslöser dieser Darstellungsprobleme war.
- Die Darstellung hält sich, abgesehen vom beschriebenen Line-height Problem, so exakt wie möglich an die Vorgaben des W3C.
- Die im Quirks-Modus aufgeführten "lockeren" Interpretationen wurden aufgehoben.
- RGB Farbwerte müssen mit einer "#" angegeben werden, usw..
- Das Body-Element kann nicht 100% hoch sein. Es ist immer so hoch wie das höchste Element in ihm.
Almost Standard Mode
Der "Almost Standard Mode” entspricht bis auf "line-height" exakt dem "Full Standard Mode”. De Facto wurde dieser Modus nur wegen der korrigierten Interpretation der line-height Eigenschaft eingeführt.
Internet-Explorer ab Version 6.0 (Windows)
Bis zum Erscheinen der Version 6.0 kannte der Internet Explorer kein Doctype Switching. Um zu gewährleisten, dass sich Internetseiten in der Darstellung im IE6 nicht vom IE5 unterscheiden, führte Microsoft dann das Doctype Switching ein. Da sich die Version 6.0 im Quirks-Modus wie seine Vorgänger verhält, kann man auch sagen, dass sich alle älteren Versionen des Internet Explorers vor Version 6 grundsätzlich im Quirks-Modus befinden und ihre Interpretation der CSS Richtlinien fehlerhaft ist.
Quirks-Modus
Bis Version 5.5x war beim Internet Explorer ein vollkommen fehlerhaftes Box Model implementiert. Um die Kompatibilität zu seinem Vorgänger zu wahren wurde dieses fehlerhafte Box Model auch im Quirks-Modus des IE 6 weiterhin implementiert.
- Das Attribut "padding" wird nicht auf IMG Elemente angewendet.
- Farbwerte in Anführungszeichen werden akzeptiert.
- white-space: pre wird als white-space:normal dargestellt. Es muss das veraltete PRE-Element verwendet werden, um diesen Effekt dennoch erreichen zu können.
- Das Body-Element kann 100% hoch sein
Standard Mode
- Generell versucht der Browser hier sich so gut wie möglich an die Vorgaben des W3C zu halten, wobei dieses Verhalten immer noch sehr fehlerhaft ist.
- Es wird das korrekte Box Model angewendet.
- Die CSS 2 Eigenschaften Min-height und word-spacing werden nun angewendet.
- White-space: pre wird korrekt dargestellt.
- Das Element "body" kann nicht 100% hoch sein. Es ist immer so hoch wie sein höchste Element.
Almost Standard Mode
Dieser Modus existiert im Internet Explorer nicht.
Internet Explorer 5.x (Mac)
Der Name des Windows Bruders lässt vermuten, dass der Internet Explorer auf dem Mac mit dem Bruder auf Windows Gemeinsamkeiten hat. Dem ist nicht so ! Der IE5/Mac wurde von einem vollkommen unabhängigen Entwicklerteam programmiert. Im Gegensatz zum Windows Bruder hält er sich abgesehen von einigen Bugs (wie bei allen Browsern) sehr streng an die CSS Richtlinien und interpretiert diese wesentlich besser als sein Windows Pendant.
Quirks-Modus
Eine kleine Verwandtschaft zwischen Mac und Windows gibt es doch. Im Quirks-Modus verhält sich der IE/Mac wie sein Windows Gegenstück im Quirks-Modus. Er hat also ebenfalls ein fehlerhaftes Box Model, akzeptiert Farbwerte in Anführungszeichen, usw.
- Formatierungen werden innerhalb von Tabellen nicht übernommen
- font-size: medium wird, genau wie beim IE4.x/win, zu klein dargestellt. Es wird stattdessen font-size: small angewendet. Die Schrift ist also um den Faktor 1,25 kleiner als erwünscht.
Standard Mode
Im Standard Modus ist der IE/mac seinem Windows Pendant überlegen (auch gegenüber Version 6). Er hält sich extrem streng an die CSS Richtlinien. Außerdem werden die Fehler des Quirks-Modus behoben.
Almost Standard Mode
Dieser Modus existiert im Internet Explorer/Mac nicht.
Opera ab Version 7 + 8
Ähnlich wie schon beim Internet Explorer kannten die Vorgängerversionen von Opera 7.0 keine Doctypes, geschweige denn Doctype Switching. Ihre Darstellung ist jedoch recht Richtlinienkonform, so dass man davon ausgehen kann, dass sie sich immer im Strict Modus befinden.
Quirks-Modus
- Das fehlerhafte Box Model des Internet Explorers wurde übernommen (!).
- Wie schon oben bei Mozilla Browsern werden Farben im RGB Format, ohne Raute (#) beginnend, akzeptiert.
- Auch hier wird Pixel als Standardeinheit bei der Grössendefinition genommen, wobei normalerweise Zahlen immer mit der entsprechenden Einheit angegeben werden müssen.
- Groß- und Kleinschreibung bei Klassen und IDs wird ignoriert.
- Klassen und IDs dürfen auch mit Zahlen beginnen.
- Der Rahmen um Tabellenzellen ist 1 Pixel breit.
- Das Body-Element kann 100% hoch sein, ohne dass Inhalte vorhanden sind.
- Die Schriftgröße 100% wird als 100% - 1 Pixel dargestellt.
Standard Mode
- Opera versucht sich bei der Darstellung der Seite so exakt wie möglich an die Vorgaben des W3Cs zu halten.
- Bei Klassen und IDs ist auf Groß- und Kleinschreibung zu achten.
- Klassen- und ID-Bezeichnungen müssen gemäß den vom W3C festgelegten Namenskonventionen verwendet werden.
- Es wird das korrekte Box Model angewendet.
- Das Body-Element kann nicht 100% hoch sein. Es ist immer so hoch wie das höchste Element in ihm.
Almost Standard Mode
Dieser Modus existiert im Opera Browser nicht.
. 
. -
. 
