Rotate text with CSS3 / HTML5

Question

I have a <span> that I want to rotate. I use HTML5, CSS3 and Internet Explorer 9.

I tried below CSS, but it does not work:

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

How to rotate a range?

Answer 1

-webkit- and -moz- for web browsers (Chrome, Safari) and Gecko browsers (Firefox), respectively.

You also need to use the equivalent for IE.

 .rotate { /* Safari, Chrome */ -webkit-transform: rotate(-90deg); /* Firefox */ -moz-transform: rotate(-90deg); /* IE */ -ms-transform: rotate(-90deg); /* Opera */ -o-transform: rotate(-90deg); /* Older versions of IE */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* CSS3 standard as defined here: http://www.w3.org/TR/css3-transforms/ */ transform: rotate(-90deg); } 

A source

Answer 2

Try -ms-transform: rotate(-90deg);

Answer 3

Built-in elements cannot be rotated. You must display them as a block level.