Last Updated
FaunaDB: GraphQL backend for JavaScript apps
If what you are looking for is a way to set type vertically, you’re best bet is probably CSS writing-mode.
If you’re just trying to turn some text, you can rotate entire elements like this, which rotates it 90 degrees counterclockwise:
.rotate {
transform: rotate(-90deg);
/* Legacy vendor prefixes that you probably don't need... */
/* Safari */
-webkit-transform: rotate(-90deg);
/* Firefox */
-moz-transform: rotate(-90deg);
/* IE */
-ms-transform: rotate(-90deg);
/* Opera */
-o-transform: rotate(-90deg);
/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}The rotation property of Internet Explorer’s BasicImage filter can accept one of four values: 0, 1, 2, or 3 which will rotate the element 0, 90, 180 or 270 degrees respectively.
Also see this blog post about sideways headers.
Could i say rotate something in IE by say 5 or 10 degrees?
Yes, but you would have to use javascript in ie6.
This thread has a lot of info on it.
However, I use jQuery for this, as there is a very nice plugin.
In fact you don’t have to use javascript for this to work in IE, you could use IE’s matrix filter!
Opps, I meant to add my comment up here… but it’s way at the bottom. Essentially, I suggested using CSS3Please.
Yes you can. To get 10 deg rotation you just use 10*1/90 which would be approx 0.11
how to rotate 45deg?
I believe is not a big problem for smart browser you can use CSS3 rotate, but for retarded browser you have to use
5 degree
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.99, M12=-0.08, M21=0.08, M22=0.99, SizingMethod="auto expand");
m11 = sin (5 * pi / 180)
m12 = cos (5 * pi / 180)
m21 = cos (5 * pi/ 180)
m22 = sin (5 * pi / 180)
for IE sample, you can check fiddle here
http://jsfiddle.net/pv8sH/
Hello, Sean Hood, to answer your question, no. You can’t. However, you can rotate something in IE by, say, 7 degrees. That is MUCH more reasonable.
Great man, it will also work for Images, we can use for rounded corner images to rotate the one single image.
css rotation does not work in ie 7 or ie 7-
Is there a way to get the angle by which the element is rotated? Would prefer a way using jquery.
Example:
For the above code, I would like to do something like:
var angle = $(".rotate").getRotateAngle(); console.log(angle); // Should print -90See: https://css-tricks.com/get-value-of-css-rotation-through-javascript/