css - CSS Rotate 在 IE 中不工作

Question

我有一个自定义的 Wordpress 主题，它在帖子的左侧垂直显示帖子的日期：

这是我用来实现它的 CSS 代码：

.datebox {
background-color: #371f13;
padding: 0;
position: absolute;
height: 20px;
width: 100px;
z-index: 10;
text-align: center;
left: 280px;
top: 25px;
/* 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);

}

在 IE8（由 IE 10 的调试控制台呈现）中，框无法正确旋转：

客户报告说日期实际上是完全颠倒的（我假设她使用的是 IE8，但我还不确定）。

我究竟做错了什么？

Answer 1

尝试使用这个：

-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=1.00000000, M21=-1.00000000, M22=0.00000000,sizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=1.00000000, M21=-1.00000000, M22=0.00000000,sizingMethod='auto expand');

Answer 2

客户端报告使用 IE9，结果证明她的 IE9（可能在兼容模式下运行）同时渲染 CSS 和 MS 过滤器。

我将 MS-Filter 移至特定于 IE8 的样式表，这解决了这两个问题。但是，出于某种原因，我确实必须调整 IE8 版本中的顶部和左侧设置。

Answer 3

CSS 转换仅适用于 IE9 及更高版本：http ://caniuse.com/transforms2d