Website-Icon Webdesign-Podcast

CSS 3 Unterstützung in IE 6-8 mit CSS3 PIE

Langsam aber sicher ist CSS 3 in immer mehr Browsern verfügbar, aktuelle Vorreiter sind hier die Webkit Browser wie z.B. Apples Safari oder Googles Browser Chrome. Der Mozilla Firefox macht seine Sache ansich auch schon ganz gut, wenn auch nicht ganz soviel Unterstützung da ist wie in den Webkit Browsern. Das eigentliche Sorgendkind bzw. die Sorgenkinder sind wieder einmal die Browser aus dem Hause Microsoft. Die Internet Explorer, in den immer noch weit gefächerten Versionen von 6-8, haben keine bis sehr mäßige CSS 3 Unterstützung.

Ähnlich dem png Problem mit fehlenden Transparenz gibt es auch hier eine Lösung über eine *.htc Datei. Konkret nenn sich diese Lösung CSS3 PIE von Jason Johnston (327 Creative LLC). CSS3 PIE lässt sich relativ einfach einbinden und erweitert die Internet Explorer 6-8 um einige CSS 3 Selektoren sowie Attribute.

Folgende CSS 3 Attribute werden durch CSS3 PIE unterstützt: border-radius, box-shadow, border-image, -pie-background (multiple background images), -pie-watch-ancestors, rgba color values, gradients.
Eine detaillierte Liste mit allen unterstützen CSS 3 Attributen findet ihr unter http://css3pie.com/documentation/supported-css3-features/

Wie schon erwähnt ist das einbinden von CSS3 PIE denkbar einfach, ihr ladet euch die htc Datei von der Webseite und erweitert euren CSS 3 Code um folgenden Schnipsel:

behavior: url(path/to/PIE.htc);

Nach dem einbinden des CSS behavior Codes sollten dann die oben aufgeführten CSS Befehle in den IE Versionen 6-8 volle unterstützt werden.

Die mobile Version verlassen