Browsertrennung per CSS
Wer Websites gestaltet, steht oft vor dem leidigen Problem, dass der Internet Explorer von Microsoft das letzte ist, was die Unterstützung von CSS (2) angeht.
Von daher ist es doppelt ärgerlich, wenn mühsam in eine Website eingebaute Features im Internet Explorer nicht funktionieren oder schlicht und einfach falsch dargestellt werden.
Dem kann mit einem kleinen CSS-Hack Abhilfe geschaffen werden.
Man geht am besten so vor. Bei Fertigstellung der Website notiert man sich die „auffallend falsch“ gerenderten Dinge im MSIE.
Dann kopiert man sich sein Stylesheet, speichert es unter anderen Namen ab und bügelt in dieser veränderten Datei solange herum, bis auch der IE die Website einigermaßen ordentlich anzeigt.
Dann baut man folgenden Schnipsel in den HTML-Code der Webseite ein:
<link rel="stylesheet" href="style-IE.css" type="text/css" />
<style type=“text/css“>
/*< ![Gutes Stylesheet fuer gute Browser. yummi yummi.[*/
@import url(style-xt.css) all;
/*]]>*/
</></style></link>
Der Code bewirkt folgendes: Der Internet Explorer in den verschiedensten Versionen „sieht“ wegen des verschachtelten Kommentars unten nur die style-IE.css.
Andere Browser (Netscape / FF, Opera) hingegen „sehen“ beide Stylesheets, laden aber das zuletzt im Dokument stehende, sprich style-xt.css und ignorieren daraufhin die style-IE.css.
So kann man ziemlich elegant die Probleme umgehen, die man mit dem MSIE hat.
Vorsicht: Der Trick funktioniert nicht im MS IE 5.x auf dem Macintosh. Der läd munter, wie Mozilla und Co, beide CSS-Dateien.
5× letzter Senf
08.02.2005, 13:27 Uhr
Warum so umständlich, wenn es doch auch valide mit M$-eigenen Mitteln geht? „Conditional Comments“ sind das Zauberwort!