Diagonal Column Headers

Question

I have column headers with long text in a html table, and I'd like to display the headers at a 45 degree angle (similar to what can be done in Excel).

Is there a standard, cross-browser way to do this with CSS or JavaScript?

I started playing with css3please.com, but the rotation doesn't seem to work, at least in IE 7. Also, another issue is that CSS rotates around the center of the element, while I need to rotate around the left side.

Any pointers will be appreciated!

Answer 1

Demo: http://jsfiddle.net/wdm954/Z2HHu/1/

-moz-transform:rotate(-45deg);
-webkit-transform:rotate(-45deg);
transform: rotate(-45deg);