Home > Webdesign > Webdesigners Darling – IE Bugfixing

Webdesigners Darling – IE Bugfixing

Ist wohl ganz klar der IE6. Er ist, da Standardbrowser in Windows XP noch immer weit verbreitet, darf nicht ignoriert werden, schert sich aber nicht sonderlich um Webstandards.
Nicht nur der transparent-png Bug zieht sich gleich durch mehrere Versionen, sondern er versteht auch nichts außer a:hover, dabei brauchte meine letzte Navigation unbedingt ein span:hover.
Auch sehr beliebt: der z-index Bug.
Ein Fix ist ohne Einschränkungen beim Design oft nur über eine per css behavior Attribut eingebundene *.htc-datei, also JavaScript, möglich.

Die folgenden beiden .hts beseitigen die schwerwiegendsten Probleme:

Die Dateien können natürlich auch kombiniert werden, um http-requests zu sparen.
Am Besten bindet man den Patch mit Conditional Comment ein, dann validiert die Seite trotz des behavior Attributs:

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" media="all"  href="css/ie7hacks.css" />
<![endif] -->

ie7hacks.css:
body{behavior: url(css/csshover3.htc);}

lt = lower than
gt = greater than
gte = greater than, or equal

Lässt man die Version weg, gilt das Statement für alle Microsoft Browser.

<!–[if lt IE 7]>
<link rel=”stylesheet” type=”text/css” media=”all” href=”/css/iewin.css” />
<![endif] –>

So kann man dem ie 5.5 z.B. auch cursor:hand statt des Standards cursor:pointer valide übergeben. Damit die Definition nicht doppelt vorkommt, kann man sie im Standard Stylesheet mit !important (womit aktuelle Browser das !important Argument benutzen) oder mit dem Pointer html>body, den die alten IE’s nicht verstehen, verstecken.

Ob die Site nun wirklich in allen Browsern funktionieren testet man am Besten mit dem IETester, oder eben dem altbekannten MultipleIE (wobei unter XP, bei mir der 5er immer gleich wieder abstürzt).

KategorienWebdesign
  1. Bisher keine Kommentare
  1. Bisher keine Trackbacks