GoldenLine
Zaloguj się
Grzegorz L.

Grzegorz L. Sam sobie sterem,
żeglarzem, okrętem…

Temat: Porada <!--[if IE]> a problem IE 9

Witam

Na pewno wielu z was po wysiłkach związanych z dopasowaniem styli tak by wyświetlały się poprawnie w każdej przeglądarce choć raz skorzystało z <!--[if IE]> .

Problem pojawił się ostatnio gdy IE 9 zaczęło w końcu dobrze wyświetlać coś z czym nie radziły sobie IE 6, 7, 8.
Powoduje to złe wyświetlanie strony która skorzystała z tego hacka pod IE 9.
Mamy zatem do czynienia z problemem przed jakim przestrzegał J. Zeldman w swoich książkach, strony nie są kompatybilne w przód.

Radzę na to uważać i jeśli to konieczne stosować bardziej domknięte przedziały takie jak np <!--[if lte IE 8]>

Pozdrawiam
Grzegorz Lipke
http://valueadd.pl
Link do wypowiedziLink
Dariusz Sikorski

Dariusz Sikorski Front-End Web
Developer, Ux/Ui
Designer

Temat: Porada <!--[if IE]> a problem IE 9

Dla IE9 od zawsze powinno się stosować tą samą składnię CSS, co dla normalnych, najnowszych przeglądarek, style specjalne mogły obejmować tylko IE6-8. Myślę, że większość osób od samego początku pisała strony, bez specjalnego stylizowania dla IE9, więc takich zaskoczonych osób, że działa ona po prostu poprawnie - będzie niewiele, ale może masz rację i ktoś się znajdzie.

Ps. można też stosować taki komentarz warunkowy, dla przedziału IE6-8:

<!--[if lt IE 9]>...<![endif]--> do wyboru do koloru ;)Dariusz Sikorski edytował(a) ten post dnia 30.05.11 o godzinie 09:42
Link do wypowiedziLink
Grzegorz L.

Grzegorz L. Sam sobie sterem,
żeglarzem, okrętem…

Temat: Porada <!--[if IE]> a problem IE 9

Problem w tym ze ktoś pisząc kod strony trzy lata temu nie myślał zapewne o tym ze nadejdzie czas kiedy IE w końcu coś poprawnie zinterpretuje i będzie to akurat IE 9. Dlatego pisanie if IE bez podania cyferki było wówczas w pewnym sensie uzasadnione. Wiadomo że możliwe jest dużo innych konfiguracji lt , gt lte itp. Ja osobiście spotkałem się z takim problemem dlatego też przestrzegam innych :)

Pozdrawiam
Grzegorz Lipke
http://valueadd.pl
Link do wypowiedziLink
Olga Grabek

Olga Grabek Senior Software
Engineer

Temat: Porada <!--[if IE]> a problem IE 9

Skoro ostrzegamy się, co ze starszych rozwiązań może nie działać pod IE9, to dorzucę kilka moich doświadczeń:

- trzeba podnieść wersje jQuery do co najmniej 1.5.1. Przy niższej wersji IE9 zachowuje się tak, jakby miał js wyłączony
- jeżeli korzystacie z deklaracji font-face wariant smiley nie działa pod IE9 (któryś tam wariant). Warto zatem sprawdzić, czy akurat ta sytuacja nie dotyczy serwisów, które robiliście. Więcej na: font-face
Link do wypowiedziLink

konto usunięte

Temat: Porada <!--[if IE]> a problem IE 9

jeśli już musicie kombinować
http://mathiasbynens.be/notes/safe-css-hacks
Link do wypowiedziLink
Michał Stachura

Michał Stachura Dedykowane serwisy i
strony www -
http://santri.eu

Temat: Porada <!--[if IE]> a problem IE 9

Myślałem że nie doczekam dnia kiedy IE będzie poprawnie interpretowało css chociaż z ta poprawnością to bym nie przesadzał :).

Teraz problemem nie jest konieczność 'hackowania' cssa na potrzeby IE a raczej dostosowania poprawności cssa dla przeglądarek starszych typu IE 6.0, 7.0 które gdzieś tam jeszcze są poinstalowane a w niektórych korporacjach są obowiązkowe bo jakiś tam serwis wewnętrzny działa tylko na tych przeglądarkach :)

Dla tych wszystkich ludzi można zrobić mały trick z użyciem jQuery co rozwiąże problem w sposób bezpieczny i bezproblemowy. Przykładowo dla IE 6.0 można spróbować napisać coś takiego :


function  msie_correct() {

	if ( $.browser.version == "6.0"  ) {

		$(".narrow").css( "width","106px" );

		$("select").css("width", "234px");

		$("textarea").css("width", "371px");

		$("#form_1_area").css("height", "405px");

		$("#form_2_area").css("height", "350px");

	}

}

co koryguje parametry cssa dla klasy .narrow, id #form_1_area oraz #form_2_area i selectów wraz z textareami
Link do wypowiedziLink
Marek Stępień

Marek Stępień JavaScript
developer, front-end
engineer.

Temat: Porada <!--[if IE]> a problem IE 9

Michał Stachura:Przykładowo dla IE 6.0 można spróbować napisać coś takiego :


function  msie_correct() {

	if ( $.browser.version == "6.0"  ) {

		$(".narrow").css( "width","106px" );

		$("select").css("width", "234px");

		$("textarea").css("width", "371px");

		$("#form_1_area").css("height", "405px");

		$("#form_2_area").css("height", "350px");

	}

}

co koryguje parametry cssa dla klasy .narrow, id #form_1_area oraz #form_2_area i selectów wraz z textareami

...i pięć razy przeszukuje drzewo DOM (wywołanie $() nie jest darmowe, wprost przeciwnie), żeby każdemu z dopasowanych do zapytania elementów osobno ustalić wartość każdej z własności, do tego nie działa przy wyłączonym JS.

A skoro to dla IE6, to trzeba też pamiętać o tym, że nie ma on getElementsByClassName, więc wyszukanie po klasie odbywa się poprzez kolejne operacje na drzewie DOM z poziomu JS. Tym bardziej cierpi na tym wydajność.

Naprawdę, zrób to w CSS via komentarz warunkowy. JS to jest niesamowicie fajny język, ale tylko wtedy, kiedy używa się go do właściwych rzeczy. Od tego, co napisałeś wyżej, jest tylko i wyłącznie CSS.Marek Stępień edytował(a) ten post dnia 15.06.11 o godzinie 19:58
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

Float right i problem pod IE7




Wyślij zaproszenie do
Anuluj