.w_rotate_up {
/*firefox*/
-moz-transform: rotate(270deg);
-moz-transform-origin: bottom left;
/*safari*/
-webkit-transform: rotate(270deg);
/*opera*/
-o-transform: rotate(270deg);
/*msie*/
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
}
Having to have separate tags in your CSS means that much of the CSS you are pushing just gets ignored by the browser anyway. To solve this I have added CSS Conditionals into minify_css.php. The supported conditional operators are: lt, gt, lte, gte, eq, not. The supported browsers are firefix,msie,chrome,safari,opera. To make a CSS line conditional simply put brackets around the contidion at the beginning of the css line. For instance:
- not msie: [not msie]
- to only show for msie: [msie]
- to only show for msie 6 [msie eq 6]
- to only show for msie greater than 6 [msie gt 6]
- to ony show for msie less than or equal to 6 [msie lte 6]
.w_rotate_up {
/*firefox*/
[firefox]-moz-transform: rotate(270deg);
[firefox]-moz-transform-origin: bottom left;
/*safari*/
[safari]-webkit-transform: rotate(270deg);
/*opera*/
[opera]-o-transform: rotate(270deg);
/*msie*/
[msie lt 8]filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
[msie gte 8]-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
}
and here is how it will look like to the Firefox browser
.w_rotate_up {
-moz-transform: rotate(270deg);
-moz-transform-origin: bottom left;
}
and in Internet Explorer:
.w_rotate_up {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
}
Hope this helps! It has helped me.