CSS und die Browser

Bisher habe ich bestimmte Auslegungen beim Internet Explorer noch verteidigt. Aber inzwischen finde ich immer weitere Fehler, die mich einfach ankotzen. Den Peek-a-boo-Bug kennt ihr ja sicherlich schon von Sandra’s Weblog. Dann gibt es den 3-Pixel-Bug, der mir immer wieder negativ aufgefallen ist.

Beim Boxmodell-Bug bin ich jedoch unschlüssig. Beide Interpretationen haben ihre berechtigung. Wenn ich z.B. eine Box auf 100% Breite setze und dann einen 20px Rahmen und einen 10px Innenabstand möchte, dann funktioniert das im Internet Explorer super. Die Box ist 100% breit. Bei anderen Browsern ist die Box aber 100% + 20px + 10px breit. Während die IE-Entwickler sich gesagt haben, dass die Breite sich auf die gesamte Box (inklussive Rahmen und inklussive Innenabstand) bezieht – sind die Firefox-Entwickler der Meinung, dass die Breitenangabe nur für den Inhalt der Box gilt. Obiges Beispiel bekommt man aber dann mit einer verschachtelten DIV hin. Das geht dann langsam aber wieder in DIVeritis über. Meiner Meinung nach ist dies KEIN Bug sondern eine andere Interpretation. Beide Interpretationen haben ihre Berechtigung. Für uns Webdesigner ist das natürlich blöd. Aber es gibt immer Möglichkeiten.

Aber trotzdem ist der Firefox wesentlich besser als der IE. Es gibt eine Reihe von CSS2-Selektoren, die im IE nicht funktionieren. Den Kind- und Nachbarselektor würde ich gerne verwenden. Aber es wird halt vom IE nicht unterstützt. Auch attributbedingte Selektoren sind was feines. So kann ich z.B. für Links, die eine neue Seite öffnen <a href=“..“ target=“_blank„></a> entsprechend anders formatieren als die restlichen Links. ein a[target=_blank] { color: #f00; } würde z.B. externe Links rot gestalten. Ich habe diese Funktion eingebaut, um einen Pfeil vor dem Link anzuzeigen.

Was mich aber jetzt vorallem gestört hat, war die verwenden von mehreren Klassen innerhalb eines Tags. So kann ich zwar im Firefox ein Listelement mit der Klasse „nav“ und der Klasse „current“ über li.nav.current schön ansteuern, aber der IE sieht
nur ein li.current. Das ist richtig Blöd. Ich will das aktuelle Navigationselement anders darstellen als ein aktuelles Menu-Element. Einzige Möglichkeit ist daher wieder ein zusätzliches DIV oder eine Anpassung der umgebenden Liste.

Aber grundsätzlich gilt: Kein IE7 installieren und Firefox verwenden. Das ist einfach gesünder.