Advanced Search

Return to Snippet

Revision: 30336
at August 12, 2010 07:58 by viatropos
Initial Code 
// css
.rotate {
   -moz-transform: rotate(-30deg);
     -o-transform: rotate(-30deg);
-webkit-transform: rotate(-30deg);
           filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=0.154, M12=-0.988, M21=0.988, M22=0.154);
       -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=0.154, M12=-0.988, M21=0.988, M22=0.154)";
             zoom: 1;
}

// sass
@mixin rotate($degrees) {
   -moz-transform: rotate($degrees);  
     -o-transform: rotate($degrees);  
-webkit-transform: rotate($degrees);
           filter:  progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=#{cos($degrees)}, M12=-#{sin($degrees)}, M21=#{sin($degrees)}, M22=#{cos($degrees)});
       -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=#{cos($degrees)}, M12=-#{sin($degrees)}, M21=#{sin($degrees)}, M22=#{cos($degrees)})";
             zoom: 1;
}

.rotate {
  @include rotate(-30deg);
}
Initial URL 
cross-browser-css-rotation-with-and-without-sass
Initial Description 

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Cross Browser CSS Rotation with and without Sass

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
css, html, browser

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
CSS