Text rotate in SCSS with IE8+
Rotate text in all browsers down to IE8. You only have to change one variable thanks to SCSS.
$rotateDeg: -10;
$rotateRad: $rotateDeg * (3.14159 / 180);
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=#{$rotateRad}, M12=#{$rotateRad * -1}, M21=#{$rotateRad}, M22=#{$rotateRad})"; /* IE8 */
-moz-transform: rotate(#{$rotateDeg}deg); /* FF3.5/3.6 */
-o-transform: rotate(#{$rotateDeg}deg); /* Opera 10.5 */
-webkit-transform: rotate(#{$rotateDeg}deg); /* Saf3.1+ */
transform: rotate(#{$rotateDeg}deg); /* Newer browsers (incl IE9) */
Thanks to SO for the IE8 code: http://stackoverflow.com/a/4617511/119909
Written by mattcodez
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Css
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#