Yllättävää? Ei tietenkään! Tulipahan vain (taas) vastaan tämmöinen ihme bugi. Kokeilen tässä laittaa DIV:in taustakuvaksi läpinäkyvää PNG:tä. Siis semmoista PNG:tä jossa on oikea alfakanava. Se on jotenkin c00l. Se on niin c00l ettei IE osaa näyttää semmoista. Ei edes Mac IE vainaa. Siksipä semmoinen on ihan pakko tehdä, meille jotka sen näkevät.
En ole saanut devattua kokeilujani Windows™-koneella. Mutta ja kuinkas ollakaan vetää Mac IE suunnittelija suun mutruun. Tyylitiedostoissa blakems.com ehdottama !important:
#main {
background: url(kuva.png) !important; /*Mozilla will apply this one*/
background: url(kuvaie.gif) ; /*IE will apply this one*/
}
ei tietenkään toimi kuten Win-puolella, vaan Mac IE se vaan näyttä PNG-kuvaa. Eikä siinä sinänsä mitään, se näyttää sen melkein oikein, mutta ilman läpinäkyvyyttä. Juju on siinä että osa läpinäkyvistä osista eivät ole näkyviä tai näkymättömiä, vaan Mac IE jättää ne kokonaan pois!
Esimerkiksi näin. Jos PNG -kuvan opasiteetti prosentteina (100% = läpinäkymätön) on seuraavanalainen:
| 40% | 100% | 60% | 100% |
tuo Mac IE sen ruudulle niin että se vähät välittää mistään mikä on kuvan reunojen ja ensimmäisen 100% opasiteetin omaavan pikselin välissä, eli näin:
| 100% | 60% | 100% |
Jolloin siis kuvan koko muuttuu. Uskomatonta. Selain siis päätti että taustakuvani olikin 16px kapeampi kuin mitä se oikeasti oli. Kaikki muu, yllättävää kyllä, oli tasan kohdallaan (tai hajalla huomaamattomasti), mutta taustakuva ei. Aina jotain. Aina yhtä ärsyttävää.
Miksi välittää kuolleesta selaimesta? Siksi että tuolla ulkona on kyseisen zombieselaimen käyttäjiä vielä. Tänne niitä on tässä kuussa tullut yli 1700 hitin verran. Ulkonäöllä on merkitystä enkä halua että saitti näyttää ihan perseeltä revityltä, vaikka Mac IE sitä olisikin.