Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Różnice w wyświetlaniu strony FF2 i FF3
Pozycjonowanie i Optymalizacja > Projektowanie stron > HTML i CSS
adby
Witam,

otóż mam problem z wyświetlaniem strony na różnych wersjach przeglądarki FireFox.
Może podam przykład:

FF 2.x


FF 3.x


Ale to nie jedyny element który się źle wyświetla. Generalnie w FF 2.x niektóre elementy wyświetlają się jako "przesunięte w dół".
Zaznaczam że to na FF 3.x wszystko wyświetla się poprawnie, a na FF 2.x są błędy.
IE, Chrome, Opera wyświetlają poprawnie.

Jakieś pomysły, podpowiedzi?
Z góry dzięki.
kikas
Może to po prostu mylna interpretacja przeglądarki. Proponuję to olać, minimalny odsetek użytkowników używa tej wersji firefoxa, a na dodatek z tego co rozumiem, te odchyły nie są jakieś rażące.
shpyo
Resetowałeś style? To jest kwestia domyślnych stylów przeglądarek wink.gif.
pozdr,
P.
adby
@kikasek - akurat w tym przykładzie co podałem, to różnica bardzo rażąca nie jest, ale to nie tylko ten jeden przypadek, inne wyglądają o wiele mniej "estetycznie", dlatego trzeba cośz tym zrobić smile.gif
@shpyo - nie miałem zresetowanych, zresetowałem i... dalej to samo sad.gif
yavaho
Sprawdz jak wygląda pod innym doctype.
DTD XHTML 1.xx
DTD HTML 4.xx
Bo inaczej interpretują padding i border.

A może nie masz wybranego żadnego doctype? Wtedy takie bądą objawy.
adby
Doctype było:
DTD XHTML 1.0

Zmieniłem na:
DTD HTML 4.01

I nadal to samo...
slawek22
CYTAT
Sprawdz jak wygląda pod innym doctype.
DTD XHTML 1.xx
DTD HTML 4.xx
Bo inaczej interpretują padding i border.

Loool smile.gif

Inny box model dla XHTML i XHTML, chyba sobie robisz jaja smile.gif Oba modele absolutnie wszystko (nie tylko BOX) interpretują tak samo (chyba, że błędnie wpisałeś przy którymś doctype). Nawet nie ma drugiego standardowego modelu BOX, więc skąd miałyby się wziąć dwa odrębne modele po jednym dla standardowego XHTML i HTML.

Edit: po prostu w FF masz po elemencie span przejście do nowej linii, jeśli element z float: right nie jest umieszczony przed tym elementem.

Rozwiązanie: przenosisz <ul id=send_error przed <p>znajdujesz się w</p> lub dodajesz:

float: left;
do stylu:
#localizer p, #location, #location li

Jak chcesz mieć taką samą interpretację w możliwie największej liczbie browserów to zawsze element z FLOAT w tym samym bloku musisz dać na początek (przed elementami inline i block BEZ FLOAT)
yavaho
CYTAT(slawek22 @ 19.11.09 - 15:37) *
Loool smile.gif

Inny box model dla XHTML i XHTML, chyba sobie robisz jaja smile.gif


Prosze bardzo, otworz sobie pod IE jeden i drugi przyklad.

KOD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html>
<head>
<style>
.box{
width:200px;
height:200px;
padding:50px;
border:20px solid #eee;
}
</style>
</head>
<body>
<div class="box">tekst</div>
</body>
</html>



KOD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style>
.box{
width:200px;
height:200px;
padding:50px;
border:20px solid #eee;
}
</style>
</head>
<body>
<div class="box">tekst</div>
</body>
</html>
slawek22
http://www.communitymx.com/content/article.cfm?cid=85fee

What does a correct doctype look like?
A complete doctype tells us first that it is a doctype and what kind of document to expect. Then it also contains a public identifier and a system identifier, sometimes referred to as "with URI" or "with address."

Start: <!DOCTYPE HTML PUBLIC
Public identifier: "-//W3C//DTD HTML 4.01//EN"
System identifier: "http://www.w3.org/TR/html4/strict.dtd">


Fajna tabelka: http://hsivonen.iki.fi/doctype/

1.] Teraz sobie popatrz na: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> wszystko quirks (tryb kompatybilności z IE). Czyli mógłbyś tego doctype tak na prawdę nie deklarować bo przeglądarki tego nie rozpoznają, źle zadeklarowany doctype. (prawy myszy w firefoxie - widzisz tryb wstecznej zgodności)

2.] Zamiast tego musisz użyć:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
W wszystkich przeglądarkach rozpoznawany jako HTML 4.01 Strict. Dobrze zadeklarowany doctype. (prawy myszy w firefoxie - widzisz tryb standardów)

3.] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
To przeglądarki rozpoznają jako STRICT, więc jeśli w przykładzie 2 zamienisz swój doctype na
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
to na 100% zobaczysz, że HTML i XHTML się renderują dokładnie tak samo (jeśli tylko doctype zadeklarujesz tak jak "chcą" przeglądarki).

Po prostu trzeba się upewnić czy doctype jest prawidłowo rozpoznawany przez przeglądarki podczas deklaracji.
yavaho
Czyli? Są te róznice w interpretacji styli w różnych doctype widoczne czy dalej nie? Bo tylko o tym napisałem.

Jezeli poda się dokładny link do odpowiedniego identyfikatora DTD to wtedy dopiero można zmusić przegladarke do interpretacji styli według jakiegoś tam standardu. Ale jest też mozliwośc podania własnego identyfikatora smile.gif



CYTAT
2.] Zamiast tego musisz użyć:

Dlaczego piszesz że musze użyć? To nie jest nigdzie wymagane.
Oczywiście uzywa tego ten kto już jest swiadomy że bez tego mogą wystapić róznice w interpretacji styli.
slawek22
Jeśli tak na to patrzeć to w sumie racja.

Jednak jeśli przeglądarka rozpozna DOCTYPE poprawnie to nie ma znaczenia czy HTML czy XHTML, oba będą renderowane dokładnie tak samo.

CYTAT
Dlaczego piszesz że musze użyć? To nie jest nigdzie wymagane.

Przeglądarki tego wymagają, o to już trzeba pytać twórców browserów smile.gif
adby
Dzięki wszystkim za pomoc, rady slawka22 okazały się rozwiązaniem problemów smile.gif
Ale miałeś łatwiej niż inni bo znalazłeś stronę i mogłeś zajrzeć do kodu smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2012 Invision Power Services, Inc.