Elementen roteren met CSS / CSS3

Ik vroeg me af toen ik voor de zoveelste keer een schuin weer te geven afbeelding tegenkwam in een webdesign, is dat niet mogelijk met CSS. Met een beetje Googlen kwam ik al snel CSS3 tegen waarmee dit mogelijk is. Helaas werkt dit dus nog lang niet altijd in alle browser dus zit ik nog steeds vast aan een transparante .PNG afbeelding.

Met dit voorbeeld kun je elk element roteren binnen je website ( afbeeldingen, tekst, etc. ). Echter is het alleen mogelijk een element 90, 180 of 270 graden roteren. Heeft iemand een idee waarvoor ik het dan kan toepassen? Mij leek het juist zo mooi dat je een JPG afbeeldingen zou kunnen gebruiken voor gedraaide afbeeldingen waar je nu een transparante afbeelding voor nodig hebt.

/* voor firefox, safari, chrome, etc. */
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
/* voor ie */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);