Etsi sivuiltani:

	Aihepiiriluettelo > CSS-oppaan etusivu > Oppaan lisäsivut > Netscape 6.x+:ään liittyviä ongelmia (jakso 2/2)

Sivun jaksot:

Introjakso

Edellinen jakso

Netscape 6.x+:aan liittyviä ongelmia

Netscape 6.0:ssa on paljon huonompi CSS-toteutus kuin uudemmissa versioissa ja Mozilla 0.9+:ssa. Se ei tue position:fixed. Sille saattaa joutua tekemään oman CSS:n. Alla on yksi tapa, jolla voidaan selaimen päivämäärää (Build ID) perustuen erotella Netscape/ Mozilla selaimia toisistaan.

<script type="text/javascript" language="Javascript">
<!--
Gecko = (navigator.product == ('Gecko'));
Date1 = (Gecko && parseInt(navigator.productSub)>=20020728);
Date2 = (Gecko && parseInt(navigator.productSub)<=20020727);
if (Date1){
document.writeln('\<lin'+'k\ rel=\"stylesheet\"\ type=\"text\/css\"\ href=\"..\/Css\/MozillaUusimmat.css\"\ media=\"screen\"\ \/\>');}
if (Date2){
document.writeln('\<lin'+'k\ rel=\"stylesheet\"\ type=\"text\/css\"\ href=\"..\/Css\/MozillaVanhemmat.css\"\ media=\"screen\"\ \/\>');}
//-->
</script>

Em. esimerkissä "erotuslinja" kulkee tiettyjen Mozilla 1.1:n / Netscape 7.0 aliversioiden kohdalla. Esim. Mozilla Gecko -selainten tukema kokeellinen CSS3-toteutus -moz-opacity kaatoi Netscape 6.0:n ja se toimi huonosti Netscape 6.1 tasoisessa Mozillassa ja Netscape 6.2.1:ssä. Tuosta ja eräästä toisesta syystä laitoin omissa CSS-tiedostoissani yhden erotuslinjan juuri edellä esitettyyn kohtaan (voit tutkia käyttämääni lähdekoodikatkelmaa).

Netscape 6.x+:n päiväykset (Build ID) ja vastaavat Mozillan versionumerot ovat seuraavat:

• Netscape6/6.0: Gecko/20001108 (perustuu Mozilla 0.6 -selaimeen).
• Netscape6/6.01: Gecko/20010131 (selain ei perustu mihinkään tiettyyn Mozilla versioon vaan on lähinnä edellisen version korjausversio).
• Netscape6/6.1: Gecko/20010726 (perustuu Mozilla 0.9.1 -selaimeen).
• Netscape 6.2: Gecko/20011019 (perustuu Mozilla 0.9.4 -selaimeen).
• Netscape 6.2.1: Gecko/20011128 (Mozilla 0.9.4.1).
• Netscape 6.2.2: Gecko/20020314 (Mozilla 0.9.4.2).
• Netscape 6.2.3: Gecko/20020508 (Mozilla 0.9.4.3).
• Netscape 7.0: Gecko/20020823/20020730 (jälk. Mac; perustuu Mozilla 1.0 selaimeen vaikka sillä on suurin piirtein sama päiväys kuin Mozilla 1.1 -selaimella (Gecko/20020826); siinä on joitakin Mozilla 1.1:een tehtyjä korjauksia; se esittäytyy (kuvitteellisena) rv:1.0.1 Mozilla (tarkistus)versiona).

Päivämäärien sijaan voi käyttää Mozillan versionumeroa. Alla kaksi Mozilla Gecko -selainten tunnistusjonoa ja niiden pohjalta tehty tunnistusehto:

Netscape 6.2.1:
Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.4) Gecko/20011128 Netscape6/6.2.1
Mozilla 0.9.4:
Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.4) Gecko/20011128

Moz094=(navigator.userAgent.indexOf('0.9.4')!=-1);

Tosin tuon tyyppiset tunnistukset eivät toimi Netscape 6.0 kohdalla, sillä se ilmoittaa vastaavan Mozilla-selaimen eri tavalla, kuten alla olevasta tunnistusjonosta käy ilmi (laitoin alapuolelle mahdollisia tunnistusjonoja:

Mozilla/5.0 (Windows; U; Win98; en-US; m18) Gecko/20001108 Netscape6/6.0

navigator.userAgent.indexOf('m18')!=-1 /* En tiedä koskeeko tämä Netscape 6.01 -selainta. */
navigator.userAgent.indexOf('Netscape6\/6.0')!=-1 /* Koskee myös Netscape 6.01 selainta. */

Koska on olemassa erityyppisiä Mozilla versioita (esim. Mozilla 0.9.1 ja Milestone 18), Build ID -tyyppiset tunnistukset ovat kattavampia. Joka tapauksessa Mozilla Gecko -selaimet on mahdollista erotella niin tarkasti kuin kulloinkin on tarpeen.

Jos haluat voit erottaa Netscape -selaimet Mozilla -selaimista esim. lisäehdolla navigator.vendor == ("Netscape7") ja antaa siten Netscape -selaimille eri päivämäärän kuin Mozilla-selaimille, esim.:

NetscapeGecko = ((navigator.vendor == ('Netscape6') || navigator.vendor == ('Netscape7'));
...
else if (Mozilla101&&NetscapeGecko)
...
else if (Mozilla11&&!NetscapeGecko)

Gecko-selainten erottelemiseen on paljon syitä. Esim. joillakin Netscape 6.1+/ vastaavilla Mozilla -selaimilla position:fixed määriteltyjen elementtien sisällä olevat position:absolute määritellyt elementit eivät asetu oikein. position:fixed määritelty esi-isäelementti luo säilytinlohkon, josta käsin position:absolute määritellyt elementit tulisi laskea, mutta eräät versiot eivät ota position:fixed määritellyn elementin asemointia aina oikealla tavalla huomioon. Alla olevassa Mozilla 0.9:llä otetusta kuvakaappauksessa position:absolute asemoitujen linkkien tulisi asettua keltaisen position:fixed asemoidun lohkon sisälle (testieni perusteella tämä virhe on korjattu ainakin Netscape 6.2.1 lähtien).

div.pageGroup, div#allPages, div.allPages2, div#PagesFi, div#PagesEn {position:absolute} /* PagesFi ja PagesEn ovat lohkon allPages jälkeläiselementtejä */
div[class="pageGroup"], div[id="allPages"], div[class="allPages2"] {position:fixed !important}
div#allPages {left:6px; top:1px;}
div#PagesFi, div#PagesEn {z-index:17; left:2px; top:2px;} /* ne Mozilla Gecko 0.9 -pohjaiset selaimet, joita olen testannut laskevat näiden lohkojen asemoinnin elementin HTML yläoikealta jättäen huomioimatta asemoinnin, joka on annettu kiinteästi määritellylle DIV-elementille, jonka id-attribuutin arvo on allPages */

Uusimmillakin versioilla on joitakin ongelmia dynaamisten valikoideni esittämisessä (lue ongelmista eräältä englanninkieliseltä testisivulta).

Jotta elementit asemoituisivat oikein kaikissa moderneissa selaimissa, Gecko-selaimille saattaa tarvita määritellä ehdollinen CSS. Sitä tulisi laatia kuitenkin mahdollisimman vähän. Suosittelen lukemaan myös Opera and MS IE selaimia koskevia ongelmia käsittelevät .

Sellaiset ja dynaamiset alivalikot, jotka toteutetaan vain CSS:n avulla eivät Netscape 6.0 -selaimissa toimi (ks. mallit) eivät toimi. Se ei ole kuitenkaan mikään merkittävä ongelma, sillä dynaamiset valikot on paljon järkevämpää toteuttaa DOM1:n mukaisella JavaScript/ ECMAScript + CSS -koodauksella (käsittelen niitä tarkemmin toisella sivulla).

Em. ongelma liittyy IFRAME elementtiin, jonka kanssa monilla Netscape 6.x/ Mozilla selaimilla on vaikeuksia (z-index ominaisuus ja asemointi eivät toimi kunnolla). Jotkut versiot eivät asemoi niitä oikein. Netscape 6.0 tulostaa ne vaikka niille olisi määritelty display:none. Netscape 6.1+-6.2.1 kaatuvat tulostettaessa sivuja, jos sivuilla on näille elementeille määritelty display:none niiden piilottamiseksi. Kaikki IFRAME elementtiin liittyvät ongelmat on ratkaistu uusimmissa Mozilla Gecko -selaimissa.

Netscape 6.1+:ssa on hieno normaalin näyttöesityksen CSS-toteutus. Oikeastaan suurin ongelma selaimen kohdalla on se, että se tarvitsee enemmän CSS:ää kuin muut modernit selaimet, sillä sen HTML-oletusasetukset eivät ole identtiset MS IE - ja Opera-selainten kanssa. Seuraavat asiat on erityisesti huomattava:

• Mikäli taulukkorivien korkeuden tulee olla ehdottoman tarkkoja, line-height tulee määrittää, joissakin tapauksissa myös ylimääräinen font-size määritys on tarpeen (huomasin nämä seikat määritellessäni dynaamisia valikoita).
• Mikäli muutetaan listojen ja listakohtien täyte- tai marginaaliarvoja, sekä padding että margin ominaisuudet tulee määritellä, sillä Netscape 6.x hoitaa oletussisennykset padding ominaisuuden avulla eikä marginaalien määrittämisellä kuten muut selaimet.

Sivun jaksot:

Introjakso

Edellinen jakso