7

我正在寻找用于在 IE8 中旋转元素的 CSS 解决方案。我发现的一些解决方案说它应该在 IE8 中工作，但它不适合我。我做错了什么？

这是我尝试过的：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        .rotate {
            font-weight: bold;color: #000;background: #aa0;display: block;margin: 0 auto;width: 300px;height: 300px;top: 10%;text-align: center;line-height: 300px;
            -webkit-transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -o-transform: rotate(-90deg);
            filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
        }
    </style>
</head>
<body>
<div class="rotate">
    TESTING ROTATION
</div>
</body>
</html>

如果您在回答之前测试您的解决方案，我将不胜感激，如果您可以编辑我给定的示例并重新发布所有代码，那就太好了。

[编辑] 如果有人仍然好奇，问题不是代码，而是测试环境。您应该在 IE10/IE11 中使用真正的 IE8，而不是 IE8 模拟器（不确定 IE9）

4

2 回答 2

7

您缺少 IE 供应商前缀 -ms-

filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

所以，使用这个

-ms-filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* for IE8 */

还请看这个问题：IE中的 CSS 旋转属性可能对您有所帮助

于 2013-10-04T08:30:17.500 回答
0

好吧，我不认为旋转过滤器在 IE8 中以优雅的方式工作。我也试过了，但它对我不起作用。我尝试使用 jquery 旋转插件。你可以试试 - http://code.google.com/p/jqueryrotate/

即使发生这种情况，我也有问题（jQueryRotate - IE8 中的问题），但它可能会对您有所帮助，以防万一。

于 2013-10-04T08:32:39.767 回答