A problem occured while loading the plugin: sgb_error_documents -> : Only variables should be passed by reference on line 81
The Comment Strikes (Back) » css » meusexmachina

meusexmachina

Úgy látszik, nem akkor érkezünk el a tökéletességhez, amikor már nem lesz mit hozzátennünk, hanem akkor, amikor már nem lesz mit elhagynunk.

Hírek // blog

The Comment Strikes (Back) [permalink]

2006. 12. 18. 15:13 • kategóriák: css

Esetleírás, bevezető

Néhány napja, az új stíluslap fejlesztése közben történt, hogy – jól olvasható kódhoz illően – az egyik CSS definícióhoz megjegyzést írtam.

El is feledkeztem erről elég hosszú időre, amíg a fejlesztés egy későbbi szakaszában Internet Explorerben nézve az oldalt ijesztő látványra figyeltem fel: az oldal teteje csaknem teljesen szétesett.

Pánikszerű ellenőrzés Firefox alatt: itt minden OK.

Mi a fene történhetett? Az oldalnak az a része mindaddig rendben volt.

A CSS fájlnak a felső részben található elemekre vonatkozó definíciói teljesen jónak tűntek. Valami titokzatos tényező folytán azonban ezek a szabályok nem működtek IE alatt.

Eszembe jutott a nemrégen – nagyjából azon a környéken – elhelyezett komment, más nem nagyon lehetett a ludas.

A megjegyzésben nem volt semmi szokatlan, hacsak az nem, hogy szokásomtól eltérően, a szövegében (“csak kommentelesnel fordulhat elö”) bennehagytam egyetlen egy magyar ékezetes betűt: egy “ö”-t.

Próbáljuk ékezet nélkül!

Javítom, mentem, F5 … BINGO … majd jó fél perc anyázás következett.

A rendellenes viselkedés eltűnt!

Kipróbáltam más ékezetes betűket és azok ékezet nélküli megfelelőit is használva kommentelni; az IE következetes volt a hibát/furcsa viselkedést illetőleg.

Elemzés, a történet kibomlik

A jelenség illusztrálására készítettem egy tesztfájlt, legyen ez a kiinduló állapot. A három header színe piros, zöld és kék, a szövegtörzs bekezdései narancsszínűek legyenek.

1. “Elrontom” a CSS-fájlt: a H1 szelektor mögé beszúrok egy kommentet, egy darab “ö”-t.
Jelenség: egyik definíció sem működik, a szöveg az alapértelmezett fekete színű marad. Megnézem!

2. Egy sorral lejjebb – a definíció mögé – teszem át az előbbi kommentet.
Jelenség: a H1 piros lett, a többi fekete marad. Megnézem!

3. A fájl 7. sorába, a H3 szelektor mögé kerüljön egy új komment, az alábbi szöveggel: “ekezet nelkuli komment”.
Jelenség: a H1 bekékül (megkapja a H3 színét), H2 és H3 fekete, a szöveg narancs. Megnézem!

Anélkül, hogy végigpróbálnánk az összes lehetséges variációt, a következő szabályszerűség fedezhető fel: az IE nem értelmezi azokat a CSS kódrészeket, amelyek egy komment ékezetes karaktere után állnak, mindaddig amíg egy következő sorban komment záró jelet (*/) talál.

Magyarázat, következtetés, csúcspont

A jelenség – amint megfejtettem – csak akkor tapasztalható, ha a html fájl UTF-8 kódolású. Ez – leegyszerűsítve – azt jelenti, hogy minden magyar ékezetes karakterünk (vagyis amelynek ASCII kódja 127-nél nagyobb) két bájton tárolódik.

Az IE a fentiek szerint a CSS fájlt is UTF-8 kódolásúnak várja, és amikor 127-nél nagyobb kódú, mégis egy bájton tárolt karakterrel találkozik, feladja: mindaddig nem értelmezi tovább a CSS fájlunkat, amíg záró komment jelet, vagyis ”*/”-t talál. Ha nem talál ilyet, akkor a fájl végéig sztrájkol.

Nem tudom, hogy normális-e ez a viselkedés. Abból a tényből viszont, hogy sem a Firefox (1.5.0.8), sem az Opera (9 build 8501), vagyis két úgynevezett szabványkövető böngésző érzéketlen ezekre a kommentekre, arra kell következtetnem, hogy ismét kedvenc böngészőm szórakoztatott el néhány emlékezetes percet okozva.

Javaslat

Mi a teendő, ha az oldalad UTF-8 kódolású?

  • ne kommenteld a CSS-t!
  • ha kommentelsz, ne írj bele ékezetes karaktert!
  • ha ékezetes a kommented, mentsd a CSS fájlt UTF-8 kódolással!

Csavar

Kedves kitartó Olvasóm, ha idáig eljutottál, játsszunk még egy kicsit a fájllal!

Mi történik abban az eddigi példáknál életszerűbb helyzetben, ha nem csak egy darab “ö” a megjegyzésünk, vagy nem az “ö” áll a megjegyzésünk végén?

Az 1. állapot “ö” betűje mögé szúrjunk be még pár karaktert, mondjuk ezt a párat: “qweqwe”. Íme!

Ááááá! Most minden definíció szabályosan működik.

Következtetés+, azaz hepiend

Amit eddig írtam, az igaz, a (hiba)jelenség létezik, csak nem annyira általános érvényű, nem annyira veszedelmes, mint ahogy az oldal közepe táján tűnt.

A megállapítás ebben a formában helytálló: Ha az IE a kommentbe írt nem UTF-8 kódolású karakter és a komment végét jelző csillag+perjel kombó között nem talál legalább 3 db ASCII karaktert, mindaddig nem értelmezi tovább a CSS fájlt, amíg egy következő kommentvége jelhez nem ér.

És még egy kiegészítés: A hibajelenséget az IE legújabb verziója, az IE7 nem mutatja, a hibát feltehetően kijavították. A webfejlesztők számára ez azonban nem jelent valódi megkönnyebbülést (és semmit le nem von ezen írás értékéből :) ), mivel az IE 6-os verziója még nagyon sokáig hűséges társunk marad!

Javaslat+

CSS megjegyzéssor végére inkább ne írj ékezetes karaktert!

Köszönöm a figyelmet!

Ja! az autós üldözés az csak vicc volt! ;)

 


Hozzászólások eddig:

Még nem érkezett hozzászólás.


Az Ön hozzászólása:

   
  Így formázhatja hozzászólását...

az oldal tetejére

Keresés


Kategóriák


Linkajánló


meusexmachina - RSS hírcsatorna

 

teamtom © 2004-2006 || pax webiscum || tesztelve: Firefox1.5 • Opera9 • Internet Explorer6+ || motor: textpattern

XHTML1.0 || CSS