Der Internetexplorer gibt sich ja bekannterweise manchmal sturer als ein polnischer Ochse, wenn es um neuere Standards geht. CSS3 hat nun transform-Befehle eingefügt, mit denen es möglich ist, Objekte zu beliebig drehen. Ab der 9-er Version funktioniert das auch für den Internet Explorer. Doch was mit den Versionen davor? Nun, auch dafür gibt es Tricks und Kniffe:

Auch der IE kann Elemente drehen

Anbei mal ein Beispiel für eine 180Grad Drehung, welche in allen Browsern funktioniert.

<style>
	img {
		transform:
			rotate(180deg)
			scale(-1, 1);

		/* für Opera */
		-o-transform:
			rotate(180deg)
			scale(-1, 1);

		/* für Firefox, Safari, Chrome */
		-webkit-transform:
			rotate(180deg)
			scale(-1, 1);
		-moz-transform:
			rotate(180deg)
			scale(-1, 1);

		/* für IE */
		filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);

	}
</style>

Selbst der IE dürfte damit keinerlei Probleme haben. Einziger Wermutstropfen: es sind auf diese Weise nur Drehungen im 90Grad Winkeln möglich. Dafür könnt ihr aber mit dem Mirror-Befehl eure Bilder sogar spiegeln. Natürlich lassen sich die Transform Befehle auch auf andere Elemente wie zum Beispiel div-Container oder p-Absätze anwenden. Probiert’s einfach mal aus und schreibt eure Erfahrungen.