2013-10-04 2 views
7

Я ищу решение CSS для вращающихся элементов в IE8. Некоторые из решений, которые я нашел, говорят, что он должен работать в IE8, но это не для меня. Что я делаю неправильно?IE8 CSS rotation

Вот что я пробовал:

<!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> 

Я был бы признателен, если вы проверить ваше решение, прежде чем ответить, и это было бы здорово л вы можете просто изменить свой приведенный пример и перепечатывать весь код.

[EDIT] Если кому-то все еще интересно, проблема заключается не в коде, а в среде тестирования. Вы должны использовать реальные IE8, но не IE8 эмулятор в IE10/IE11 (не уверен, что IE9)

+0

Возможный дубликат: http://stackoverflow.com/questions/4617220/css-rotate-property-in-ie – tborychowski

ответ

7

Вы пропускаете IE префикс поставщика -ms-

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

Итак, используйте этот

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

Также обратите внимание на этот вопрос: CSS rotate property in IE, который может вам помочь

+0

Работает ли он для вас? Не могли бы вы дать мне полный HTML-код, например, мой пример? Потому что это не сработает для меня :( –

+0

Теперь работа для меня. –

0

Ну, я не думаю, что фильтры для вращения работают элегантно в IE8. Я также пробовал это, но он не работал для меня правильно. Я попытался использовать плагин jquery rotate. Вы можете попробовать это - http://code.google.com/p/jqueryrotate/

У меня проблема с этим (jQueryRotate - Issue in IE8), но это может помочь вам на всякий случай.