2013-10-04 18 views
7

Sto cercando una soluzione CSS per elementi rotanti in IE8. Alcune delle soluzioni che ho trovato dicono che dovrebbe funzionare in IE8, ma non per me. Cosa faccio di sbagliato?IE8 Rotazione CSS

Ecco cosa ho provato:

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

Gradirei se si prova la vostra soluzione prima di rispondere, e sarebbe bello ir si può solo modificare il mio dato esempio e ripubblicare tutto il codice.

[EDIT] Se qualcuno è ancora curioso il problema non è il codice, ma l'ambiente di test. Si dovrebbe usare vera IE8, ma non IE8 emulatore in IE10/IE11 (non è sicuro su IE9)

+0

possibile duplicato: http://stackoverflow.com/questions/4617220/css-rotate-property-in-ie – tborychowski

risposta

7

Ti manca IE prefisso fornitore -MS-

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

Quindi, utilizzare questo

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

Anche questa domanda: CSS rotate property in IE che potrebbe aiutarti

+0

Funziona per voi? Potresti darmi un codice HTML completo come il mio esempio? Perché non funzionerà per me :( –

+0

Ha funzionato per me ora. Grazie. –

0

Beh, non penso che i filtri per la rotazione funzionino in modo elegante in IE8. L'ho provato anche io, ma non ha funzionato correttamente. Ho provato a utilizzare il plugin per la rotazione di jquery. Puoi provarlo - http://code.google.com/p/jqueryrotate/

Ho un problema anche con quello in corso (jQueryRotate - Issue in IE8), ma potrebbe aiutarti, per ogni evenienza.