Strona nie działa pod Internet Explorer, Jak stworzyć kompatybilności strony z IE8/IE9 Opcje

[jacked]

Cześć, tworzę motyw pod wordpress-a. Na razie koduję go w HTML i CSS, i na tym etapie staje pierwszy poważny problem. Pod nowymi przeglądarkami, jak FireFox, Chrome, Opera, Safari strona wygląda poprawnie - tak jak ma wyglądać. Jednak gdy tylko otworzę ją w Internet Explorer 8, na stronie jest totalny chaos. Menu i slider to totalna tragedia, w contencie strony tak samo.
Tak jakby niektóre style CSS wcale nie działały(np. float:left; | clear:both;). Nie wiem czy to wina CSS, czy HTML. Strona jest pisana co prawda w HTML 5, ale używam tylko nowych znaczników, więc nie powinno być z tym problemów. Używam także resetu stylów normalize.css. Który dodatkowo ustawia odpowiednim znacznikom HTML 5 właściwość display:block. Z resetem styli, czy bez, nic się nie zmienia.
A sam szablon waliduje się poprawnie.

Strona absolutnie musi być zgodna przynajmniej z IE 8 i 9. Chcę ten problem rozwiązać już teraz, gdy będę miał więcej plików HTML, to mogę mieć dużo więcej pracy z wprowadzaniem zgodności z Internet Explorerem.
Nie wiem jeszcze, jak sprawa wygląda z IE 9, ale obawiam się że podobnie, zaraz zainstaluję i sprawdzę.

Cz ktoś wie, jak zapewnić stronie kompatybilność z IE?
Szukałem w sieci cały wczorajszy dzień, nic nie znalazłem.

LINK DO SZABLONU

Nie wstawiam pliku CSS, bo ma ok. 1500 linijek, mam nadzieję, że każdy z Was ma fireBuga (IMG:style_emoticons/default/smile.gif)

Ten post edytował jacked 14.01.2012, 13:01:34

[pedro84]

To jest obowiązkowe jeśli chcesz użyć HTML5:

[HTML] pobierz, plaintext 
<!--[if IE]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
[HTML] pobierz, plaintext 

[jacked]

Dzięki wielkie, to rozwiązało większość problemów! Są tylko jeszcze dwie sprawy:
1. Menu - kiedy odświeżam stronę, to domyślnie wszystkie sub-menu, są rozsunięte. Kiedy najeżdżam pozycję w menu, to w dziwny sposób poszerza się.
2. Drugi problem to taki, że chyba nie ma wsparcia właściwości CSS3 border-radius. Ale postaram się poszukać jakiegoś sposobu.

I tak dziękuję bardzo za pomoc!

[pedro84]

1. Nie mam na tej maszynie IE8, więc za bardzo nie pomogę.
2. http://css3pie.com/

[by_ikar]

2. Drugi problem to taki, że chyba nie ma wsparcia właściwości CSS3 border-radius. Ale postaram się poszukać jakiegoś sposobu.

Nie ma i nie będzie. Jeżeli tło masz obrazkowe, to zapomnij o jakim kolwiek sposobie który ci zadziała pod ie8. Ostatnio kilka dobrych godzin na to straciłem i żadne znalezione rozwiązanie, które miało "gwarantować" że zadziała, nie zadziałało.. Tak samo zapomnij o text-shadow, box-shadow uważaj na z-index, bo IE zupełnie inaczej go interpretuje niż wszystkie inne przeglądarki.

1. Menu - kiedy odświeżam stronę, to domyślnie wszystkie sub-menu, są rozsunięte. Kiedy najeżdżam pozycję w menu, to w dziwny sposób poszerza się.

To je ukryj już z poziomu css (display: none; lub visibility: hidden;).

Ogólnie daruj sobie IE. Im więcej osób wspiera IE 6/7/8 tym dłużej te przeglądarki są w obiegu. Poinformuj jedynie użytkownika, żeby zaktualizował swoją przeglądarkę, lub skorzystał z innej.

PS. pseudo selektor hover, z tego co pamiętam w IE działa tylko dla <a> i też trzeba używać jakieś hacki żeby to zadziałało. Ogólnie połowa rzeczy umieszczanych w head to są hacki dla IE żeby coś normalnie działało... badzIEwie normalnie..

[Pawel_W]

Nie ma i nie będzie. Jeżeli tło masz obrazkowe, to zapomnij o jakim kolwiek sposobie który ci zadziała pod ie8. Ostatnio kilka dobrych godzin na to straciłem i żadne znalezione rozwiązanie, które miało "gwarantować" że zadziała, nie zadziałało.. Tak samo zapomnij o text-shadow, box-shadow uważaj na z-index, bo IE zupełnie inaczej go interpretuje niż wszystkie inne przeglądarki.

są na to fixy (IMG:style_emoticons/default/smile.gif)

Ogólnie daruj sobie IE. Im więcej osób wspiera IE 6/7/8 tym dłużej te przeglądarki są w obiegu. Poinformuj jedynie użytkownika, żeby zaktualizował swoją przeglądarkę, lub skorzystał z innej.

jak myślisz, ilu użytkowników tak zrobi? 99% opuści stronę, przez co tracisz odwiedzających... poza tym, nie wszyscy mają możliwość aktualizacji (np. pracownicy w firmach)

PS. pseudo selektor hover, z tego co pamiętam w IE działa tylko dla <a> i też trzeba używać jakieś hacki żeby to zadziałało. Ogólnie połowa rzeczy umieszczanych w head to są hacki dla IE żeby coś normalnie działało... badzIEwie normalnie..

pierwszy raz słyszę o czymś takim, z tego co pamiętam to tylko w IE 6 był taki problem (IMG:style_emoticons/default/smile.gif)

[by_ikar]

są na to fixy (IMG:style_emoticons/default/smile.gif)

jak myślisz, ilu użytkowników tak zrobi? 99% opuści stronę, przez co tracisz odwiedzających... poza tym, nie wszyscy mają możliwość aktualizacji (np. pracownicy w firmach)

pierwszy raz słyszę o czymś takim, z tego co pamiętam to tylko w IE 6 był taki problem (IMG:style_emoticons/default/smile.gif)

To pokaż mi najlepiej na jakiejś stronie przykład. Tylko z tłem obrazkowym (IMG:style_emoticons/default/wink.gif) allegro sobie to olało że użytkownikom IE nie wyświetlają zaokrąglone rogi. Ciekawe dlaczego ? (IMG:style_emoticons/default/wink.gif) nie chcą się bawić z fixami? Nie wydaje mi się (IMG:style_emoticons/default/wink.gif)

Jak masz ie 6/7/8 to sprawdź. Na ie 7 i 6 bankowo nie działa hover dla innych znaczników niż <a>. Nie powiem jak jest w ie 8 i 9 ale sądząc po tym że w ie 8 są nadal problemy z kanałem alpha w plikach png, to wydaje mi się że hover również tam kuleje..

Ci co nie mogą zainstalować innej przeglądarki, mogą zainstalować chrome frame. Jak będziemy dalej wspierać ie poniżej wersji 8/9 to strony będą spuchnięte od ilości fixów. A i tak wszystkiego nie da się naprawić. Jak chociaż by border-radius.. fixy na png działają, ale nie zawsze i ostatnio miałem nawet przykład. A potem weź to zrób tak jak zrobił to grafik..

EDIT: Jednak źle myślałem o tym hover, działa poprawnie już od IE7, szkoda że wcześniej o tym nie wiedziałem i uważałem na hover. Tutaj masz całą listę, co działa pod IE a co nie i pod jaką wersją: http://msdn.microsoft.com/en-us/library/cc...v=vs.85%29.aspx nawet nie wiedziałem że pozycjonowanie w IE praktycznie do wersji 9 działało tylko częściowo (partial)... Dopiero ie9 można uznać że jest w miarę przeglądarką, poprzednie wersje powinny iść natychmiast w niepamięć (IMG:style_emoticons/default/wink.gif)

Ten post edytował by_ikar 15.01.2012, 11:29:41