2013-10-04 13 views
7

Tôi đang tìm giải pháp CSS để xoay các phần tử trong IE8. Một số giải pháp tôi đã tìm thấy nói rằng nó sẽ làm việc trong IE8, nhưng nó không cho tôi. Tôi đã làm gì sai?Xoay CSS IE8

Đây là những gì tôi đã cố gắng:

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

tôi sẽ đánh giá cao nếu bạn kiểm tra giải pháp của bạn trước khi trả lời, và nó sẽ là tuyệt vời ir bạn chỉ có thể chỉnh sửa ví dụ đã cho tôi và repost tất cả các mã.

[EDIT] Nếu bất kỳ ai vẫn tò mò thì vấn đề không phải là mã, mà là môi trường thử nghiệm. Bạn nên sử dụng IE8 thật, nhưng không IE8 giả lập trong IE10/IE11 (không chắc chắn về IE9)

+0

có thể trùng lặp: http://stackoverflow.com/questions/4617220/css-rotate-property-in-ie – tborychowski

Trả lời

7

Bạn đang thiếu IE nhà cung cấp tiền tố -ms-

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

Vì vậy, Sử dụng này

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

Ngoài ra hãy xem câu hỏi này: CSS rotate property in IE có thể giúp bạn

+0

Tính năng này có phù hợp với bạn không? Bạn có thể cho tôi mã HTML đầy đủ như ví dụ của tôi không? Bởi vì nó sẽ không làm việc cho tôi: ( –

+0

Đã làm việc cho tôi bây giờ. –

0

Vâng, tôi không nghĩ rằng các bộ lọc để xoay hoạt động theo cách thanh lịch trong IE8. Tôi cũng đã thử điều đó, nhưng nó không làm việc cho tôi đúng cách. Tôi đã thử sử dụng plugin jquery rotate. Bạn có thể thử điều đó - http://code.google.com/p/jqueryrotate/

Tôi gặp sự cố ngay cả khi xảy ra (jQueryRotate - Issue in IE8), nhưng có thể giúp bạn, chỉ trong trường hợp.