Vrankey 's Blog

Letzte Woche durfte ich mich beim Bau von Templates am Arbeitsplatz mit Fragen der Browserkompatibilität auseinandersetzen. Im Fokus standen dabei die wichtigsten Browser Mozilla Firefox sowie die beiden letzten Version 6 und 7 des Microsoft Internet Explorers. Kern des Problems waren unterschiedliche Interpretationen von CSS-Code, bspw. von Height- und Width-Werten in DIV-Elementen. Vor allem der Internet Explorer 6 verhielt sich hier etwas außerhalb des Rahmens.

Ein Hack, den ich entdeckt habe, und der so auch auf Little Boxes bestätigt wird, sieht vor, das gleiche Attribut in einem Block zwei mal mit unterschiedlichen Werten zu definieren. Der Zusatz “!important” soll dabei angeben, welche Variante bevorzugt werden soll, was in Firefox und IE7 auch richig umgesetzt wird.

Für die Lösung des Problems ist dabei folgender Umstand zentral: Da der IE 6 den Zusatz “!important” nicht kennt, bricht er die Interpretation von mit diesem versehenen Zeilen ab und bevorzugt Varianten ohne ihn. Wie Little Boxes bestätigt, ist der IE 6 jedoch durchaus in der Lage “!important”-Zeilen umzusetzen – er tut dies allerdings nur, wenn im gegebenen Namespace keine “!important”-freien Definitionen desselben Attributs existieren.
Heißt im Klartext: als “wichtig” markiertes wird im IE 6 nur ausgeführt, wenn nichts “unwichtiges” existiert. *hust*

Ein amüsanter Zustand, zu dem sich mancher Freund von Cross-Browser-Kompatibitäts-Fragen seinen Teil denken wird. Ich war jedenfalls diese Woche dafür dankbar, da mir dadurch “Parallel Stylesheeting” erspart blieb.