[CSS + IE] No takie cyrki ze szok. IE takie złe?


(Lysy1033) #1

Panowie witam.

Jest problem hehe.

Więc napisałem stronę której layout oparłem na divach z css. w css uzywalem tylko margin padding border i float no i jeszcze clear. (nie licze formatowania tekstu). Pierwszy problem pojawił się gdy zagniezdzilem diva w innym divie przez php wewnetrzny div jest dynamiczny wiec rozumialem ze wysokosc zewnetrznego diva bedzie zalezala od wysokosci wewnetrznego i zgodnie z paddingami i marginami borderami bedzie sie rozciagal ten zewnetrzny div. po borderach okazalo sie ze ten div zewnetrzny w ogole sie nie rozciaga (rozciaga sie tylko na kilka pixeli) i ten border zewnetrznego diva (dolna krawedz) jest pod trescia tego wewnetrznego diva. wiec do zewnetrznego diva kombinowalem z dodawaniem display: i chyba wszystko co wypisane w internecie do tego displaya dopisywalem. efekty zalezne od przegladarki. testowalem na ie 7 i firefox. teraz kolega zobaczyl ze na ie6 ta strona to tylko sieczka. Panowie jak sie przed takimi sytuacjami uchronic? gdzie szukac? jakie sa cechy css ktore sa roznie interpretowane przez przegladarki? ratujcie


(Kutar 0) #2

Na ten temat można by książkę napisać xD

daj kod albo linka...

@EDIT: literówka


(Bcb) #3

Staraj się nie korzystać z padding, lepiej zastąpić to marginem wtedy jest większe prawdopodobieństwo, że na obu przeglądarkach nie będzie znacznej róznicy, co do wysokości zewnętrzego diwa dałeś mu height: auto?


(Lysy1033) #4

ok doszedlem do kilku wniosków i pojawił się taki problem.

Mam diva a w nim dwa divy (jeden ma float left drugi right) chcialbym teraz zeby border zewnetrznego diva rozciagal sie w zaleznosci od wysokosci tych wewnetrznych divow. da się tak? gdzies przeczytalem, ze floatem "wyciagam" divy na zawnatrz i przez to zewnetrzny div nie wie na jaka wysokosc sie rozciągnąć. jak można rozwiązać taki problem?


(Kutar 0) #5

No jasne... to padding jest nie potrzebny w ogóle i możemy go wyłączyć ze specyfikacji CSS xD

Z fantem paddingu w IE6 można sobie poradzić w prosty sposób. Otóż IE6 ignoruje takie coś jak max-width i min-width. Dlatego w w width ustawiamy wartość dla IE6, a w max-width (lub min-width) wartość dla innych przeglądarek.

możesz to osiągnąć za pomocą np. overflow. Daj kod to Ci pokaże na przykładzie jak to będzie wyglądać u Ciebie.