Can I display text at an angle on a web page?

Question

I would like to know whether or not to create text on a web page at an angle, for example, at 40 degrees. If possible, how can I do this?

EDIT: Finally, I decided to go with Matthias Binens answer.

Answer 1

To add Mathias to the answer, you can also rotate the text in IE: http://snook.ca/archives/html_and_css/css-text-rotation

However, you must multiply by 90 °.

Alternatively, you can use SVG / VML for rotated text. See, for example, on this page: http://raphaeljs.com/text-rotation.html

It uses the RaphaelJS library to rotate text in a browser without images.

Answer 2

Use CSS3 transforms:

.selector { -webkit-transform: rotate(40deg); -moz-transform: rotate(40deg); -o-transform: rotate(40deg); transform: rotate(40deg); } 

IE supports filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); , where the rotation property takes one of four values: 0 , 1 , 2 or 3 , which will rotate the element 0, 90, 180 or 270 degrees, respectively, Its filter, although, therefore, I would not recommend using it.

Answer 3

Matthias is right in his answer, but you can use your filter to support IE:

 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /*play with the number to get it right*/ 

Then IE will be supported too :)