CSS在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