2013-05-02 17 views
7

Próbuję obrócić tekst w IE8. Według this odpowiedź, powinno być możliwe, aby obrócić element jak próbował w poniższym przykładzie:Dlaczego ta rotacja elementów nie działa?

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
     #enclosing { 
      width: 20px; 
      height: 100px; 
      border: 1px solid; 
     } 

     #rotated { 
      -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=6.123031769111886e-17, M12=1, M21=-1, M22=6.123031769111886e-17, SizingMethod='auto expand')"; 
      width: 100px; 
     } 
    </style> 
</head> 

<body> 
    <div id="enclosing"> 
     <p id="rotated">rotated</p> 
    </div> 
</body> 
</html> 

(dostał numery od this generatora)

Gdybym skontrolować elementu p z narzędziami dev Widać, że jest w pewien sposób dotknięty, ponieważ niebieska ramka pokazująca wybrany element jest poprawnie obracana (ale rzeczywisty element nie jest obracany), patrz obrazek poniżej.

ispected with dev tools

Edit: Dla wyjaśnienia, to jak to wygląda bez rachunku filtr:

without filter statement

+0

Czy próbowałeś tylko 'filtr:' '-ms bez-' z przodu? – Morpheus

+0

Tak, nic się nie dzieje bez prefiksu dostawcy. (Nawet obrót wyświetlany na zdjęciu) – rob

+0

Wystarczy notatkę z generatora: _/* IE8 + - musi być na jednej linii, niestety */_ Czy Twoja deklaracja jest w jednym wierszu? – Morpheus

Odpowiedz

4

Bieżące prace znaczników, problemem jest to, że trzeba włączyć filtry starszych w IE10 poprawnie wyrenderować wyniki w IE10 pracującym w trybie IE8.

Tak, wtedy odpowiedź jest umożliwienie filtry starszych: http://blogs.msdn.com/b/ie/archive/2012/06/04/legacy-dx-filters-removed-from-ie10-release-preview.aspx

Przejdź do sekcji „Ustawienia [Bieg]” >> „Opcje internetowe” >> „Zabezpieczenia” Następnie kliknij przycisk „Poziom niestandardowy” i przewiń w dół w wynikowym oknie, aby znaleźć opcję "Wypełniaj starsze filtry". Odblokuj to.

Enable legacy filters in IE10

2

Biorąc pod uwagę, że już wyjaśnione w komentarzach, że testujesz w trybie IE8 Comaptibility, zamiast prawdziwej kopii IE8, łatwiej jest odpowiedzieć. Odpowiedzią na Twój problem jest explained here on MSDN

W skrócie, IE10 uważa, że ​​styl filter jest przestarzały i domyślnie go wyłącza, nawet w trybie zgodności. Można włączyć, ale tylko przez użytkownika końcowego.

Nie ma to wpływu na IE9; filter style działają dobrze w IE9, ale dla IE10 będziesz miał problem.

Cytując:

Internet Explorer 10, filtry DX nie zadziała (są nieaktualne) w następujących trybach dokumentu:

tryb
  • Quirks
  • tryb standardy IE10

Dla innych trybów dokumentów filtry DX są (domyślnie) wyłączone dla strefy internetowej i włączone dla Local Intra strefy sieci i Zaufane witryny. Ma to wpływ następujące tryby dokumentu:

  • tryb IE9 Standards
  • tryb IE8 Standards
  • Tryb IE7 Standards
  • tryb ie5 (Quirks)

użytkownicy końcowi mogą zmienić te ustawienia (tylko w przypadku tych trybów dokumentów) za pomocą Opcji internetowych, aby zmienić ustawienia zabezpieczeń dla danej strefy. Administratorzy mogą również używać zasad grupy.

Uwaga Ze względów bezpieczeństwa i wydajności jest to zdecydowanie odradzane. Ponadto strony internetowe nie mogą modyfikować tych ustawień (zazwyczaj z tych samych powodów).

Efektem jest to, że w IE10 nie można niezawodnie używać stylów filter w trybie zgodności.

Oznacza to, że:

  1. Korzystanie z trybu zgodności w celu przetestowania, czy kod działa w starszych IES nie jest dobry test. Aby mieć dokładny test, musisz używać rzeczywistych kopii starych wersji IE.

  2. To zły pomysł, aby umożliwić wyświetlanie witryny w trybie zgodności przez użytkowników. Zmuszenie ich do obejrzenia strony w najlepszym trybie renderowania IE za pomocą metatagu X-UA-Compatible.

+0

Dziękuję za ten opis. Zdecydowanie zgadzam się z tobą w pierwszym punkcie (szczególnie po tym kosztowało mnie to dzień). Nie wiedziałem, że drugi punkt jest możliwy, ale myślę, że to nie będzie duży problem. Bo kto uruchamia IE w trybie zgodności innym niż do testowania? – rob

+0

@rob - w IE są ustawienia konfiguracyjne, które w niektórych przypadkach nakazują domyślne użycie trybu zgodności. Niektórzy użytkownicy korporacyjni mogą mieć włączone te ustawienia (a użytkownik końcowy może nawet nie być tego świadomy), co oznacza, że ​​nie można * mieć pewności * w jakim trybie będzie wyświetlana witryna dla wszystkich użytkowników. Możesz użyć 'X-UA-Compatible' aby zastąpić te ustawienia. – Spudley

+0

Nie wiedziałem o tym ... dodano ' 'do mojego nagłówka :) – rob