HTML Tutorial mit Video – Der Quirks Modus und margin auto im Internet Explorer

HTML Tutorial mit Video – Der Quirks Modus und margin auto im Internet Explorer

Hier können Sie das Video in voller Größe ansehen

Wer schon einmal versucht hat, im Internet Explorer Divs per margin auto horizontal auszurichten, wird sich mit dieser Thematik früher oder später auseinandergesetzt haben: Dem Quirks Modus.

Nein! Wir befinden uns nicht in einem Physik-Tutorial über Quarks und Co. Wir sprechen von den Browsern.

Auch wenn jeder Designer sich Mühe geben sollte, seine Webseiten valide zu programmieren, so wird man nur wenige Internet Seiten im Internet finden, die einen sauberen einwandfreien Quellcode haben. Das hat auch schon oft den Ursprung in den CMS Systemen (Content-Management-Systeme – also Seiten, die man ohne Programmierkenntnisse einfach anpassen kann), die gerne eingesetzt werden.

Die Browser müssen wahre Künstler sein, in dem, was sie teilweise aus sehr viel falschem Code noch zaubern. Teilweise grenzt es an ein Wunder, daß viele Seiten so ansehnlich aussehen.

Damit das Ganze überhaupt möglich ist, haben die Entwickler in den einzelnen Browsern den sogenannten Quirks-Modus eingeführt. Dies ist ein Modus, der sehr viel falsches akzeptiert und versucht richtig zu interpretieren. Dieser Modus wird automatisch geschaltet, wenn der Doctype der Internet Seite nichts anderes verlangt.

Der Internet Explorer zum Beispiel hat auch einen solchen Quirks Modus. Nur ist es hier ein klein wenig verwunderlich, daß ausgerechnet dieser “Fehlertolerante” Modus nicht in der Lage ist, ein Div per margin auto horizontal auszurichten.

Demzufolge muss man im Internet Explorer den Quirks Modus ausschalten, um die horizontale Ausrichtung per margin auto zu realisieren.

Hierfür gibt es folgende Doctypen:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>

Wer sich mit dem Thema Quirks Modus in den verschiedenen Browsern weiter auseinandersetzen möchte kann dies unter folgenden Links tun:

Mozilla/Firefox

Mozilla’s DOCTYPE sniffing
Mozilla Quirks Mode Behavior

Internet Explorer

DOCTYPE-Switch im Internet Explorer
CSS Enhancements in Internet Explorer 6

Opera

The Opera 9 DOCTYPE Switches

Share and Enjoy: Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • MisterWong
  • Y!GG
  • Webnews
  • Digg
  • del.icio.us
  • StumbleUpon
  • Reddit
  • Alltagz
  • Ask
  • BlinkList
  • Bloglines
  • blogmarks
  • Facebook
  • Furl
  • Google Bookmarks
  • Infopirat
  • Linkarena
  • Live-MSN
  • MySpace
  • Newstube
  • SEOigg
  • Tausendreporter
  • Technorati
  • TwitThis
  • Weblinkr
  • Wikio DE
  • YahooMyWeb
  • Blogosphere News
  • Linkarchiv

Related posts:

  1. CSS Tutorial mit Video – Hintergrund für Internet Seite erstellen Um einen Hintergrund für eine Webseite zu erstellen kann man...
  2. WICHTIGES Sicherheits-Update für Internet Explorer 6-8 Heute möchte ich alle meine Besucher darauf aufmerksam machen, daß...
  3. Webseiten auch für den Internet Explorer 6 optimieren Auch wenn ich bereits in einem anderen Tutorial (Vorschau von...
  4. Cookies von Iframes im Internet Explorer ...Hierbei geht es um den Umgang mit Cookies von Drittanbietern....
  5. IT Sicherheit – Internet Explorer und die Aurora Attacke per mshtml.dll Der Internet Explorer und die Aurora Attacke. Das BSI -...

Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>