Ongelman suurin ydin oli Ionicin kasvattilista. Se toimi erinomaisesti Operalla, sekä omalla koneella että palvelimelta käsin. Screenshot löytyy alta, mutta todennäköisesti ja toivottavasti kaikki muutkin käyttäjät näkevät saman näkymän tuolla kasvattajasivulla. Suunnilleen samalta sivun pitäisi näyttää myös IE:llä katsottuna.
Mutta sitten oli Firefox ja Chrome. Molemmilla kasvattisivu näytti omalla koneella siltä, kuin siitä olisi unohtunut CSS-tiedosto kokonaan:
Firefoxilla sivu näytti samalta myös palvelimella, Chromella palvelimella oleva sivu ja CSS-tiedosto sen sijaan toimivat moitteettomasti. Kuitenkin sama CSS-tiedosto toimi täysin oikein ja ilman mitään ongelmia kaikilla muilla sivuilla ja kaikilla selaimilla. Esimerkiksi hevoslistaus-sivu käyttää samaa CSS-tiedostoa ja se toimii CSS:n kanssa, katsoi sitä millä selaimella tahansa.
Vika ei siis ollut CSS-tiedostossa, muttei se ollut kasvatti-sivun koodissakaan, koska tismalleen sama koodi toimi siellä hevoset.html-sivulla:
Hyökkäsin ongelman kimppuun käyttämällä Chromen ja Firefoxin developer tooleja. Chromen työkalun kanssa törmäsin sitten todella outoon käytökseen.
Kun avasin sivun ja developer toolin, kaikki näytti ensin olevan ihan kunnossa, lukuunottamatta sivun ulkoasua:
Klikkasin sitten itseni jollekin kasvatin sivulle listalta, niillä CSS toimi moitteettomasti ja developer toolin näkymä näytti ihan samalta kuin kasvatti-sivullakin. Kun palasin takaisin kasvattilistaan, minua odotti yllätys: CSS toimii yhtäkkiä!
Ilo oli kuitenkin lyhytaikainen, koska päivittäessäni sivun CSS-määritykset katosivat ja CSS-tiedoston sisältö developer toolissa muuttui japaniksi! Onneksi tämä tapahtui vain developer toolissa, itse CSS-tiedosto oli kyllä ihan koskematon.
Tässä vaiheessa alkoi loppua hakusanat kesken, edes Google ei tarjonnut yhtään mitään järkevää hakusanoilla "chrome developer tool changes css into japanese". Mieleen jäi kuitenkin kaivamaan ajatus siitä, että tämä voisi olla jonkinlainen merkistöongelma, tuo haiskahti jotenkin sellaiselta. Viis siitä että vihaan kaikenlaisia merkistöongelmia. Jostain kaivellessani ratkaisua tai ihan mitä tahansa törmäsin väitteeseen siitä, että html pitäisi olla tallennettuna joko ANSIna tai UTF-8:na (jälkimmäinen, jos sisältää erikoismerkkejä). Ja enkös minä vain ollut tallentanut Unicodena... Ratkaisun avain oli tässä: CSS toimii täydellisesti, kun tallensin kasvatti-sivun uudelleen, mutta valitsin encodingiksi UTF-8:n!
Tämä ongelma ei ole uusi, toisinaan olen törmännyt siihen omien hevosteni sivuilla jo vanhemmankin CSS-tiedoston kanssa. Näiden kohdalla tilanne ei ole ollut niin kovin kriittinen, joten en ole lähtenyt sen paremmin selvittelemään mikä voisi olla vikana. Ja koska käytän pääselaimena Operaa, jolla tällaisia ongelmia ei ole koskaan ollutkaan, en ole jaksanut vaivata päätäni muutaman hevosen sivuilla. Tuo kasvattisivun toimimattomuus nyt oli sen verran suuri ongelma, että siihen piti paneutua enemmän.
Nyt sitten pitäisi enää löytää ne kaikki sivut, jotka on tallennettu Unicodena...
–S
Ei kommentteja:
Lähetä kommentti