CSS i IE ser helt jævelig ut..

[discostu]

Har nå brukt 2 uker på å kode litt i css, og selfølgelig brukt firefox til å se på hvordan det ser ut.. I mellomtiden har jeg også prøvd å bruke IE til å se på det men designet er helt anderledes, så jeg bestemte meg for å lage 2 css script for hvert av disse browserne (til ett skoleprosjekt).

Jeg er nødt til å lage samme designet for IE, grunnet vi skal lage en side som om vi skulle laget den for en virkelig bedrift, og siden IE har ganske stor del av markedet så er det nødvendig at siden funker skikkelig i IE.

Nok pjatt..

 

Saken er den, hvordan skal jeg kode for at ting skal se bra ut i IE? Noen generelle tips?

Hva funker i IE, hva funker ikke?

Fant fort ut at det var liten vits i å prøve å kode noe som funket i begge browserne, da måtte det veldig mye fikling til.. Noe jeg absolutt ikke gadd der og da..

[haugsand]

Det er fullt mulig å bruke samme CSS til firefox/opera/++ og IE, men det forutsetter at du kjenner til hva IE tolker feil, og hvordan du kan takle problemene. Jo mer erfaring du får, jo mindre problemer vil du få med å tilpasse sidene for IE.

 

En god start er å lese disse gjennom disse sidene:

Explorer Exposed!

CSS crib sheet

[JonH]

Det er bare å prøve å feile, og spørre om man står fast på noe. Jeg har uansett fått uvurderlig hjelp her på forumet. Nå ser sidene noenlunde like ut i både IE, Opera og Firefox - det uten altfor mye fikling! Du kan jo ta en titt her. Helt sikkert mye å forbedre ennå

 

 

PS! Nå må det sies at heller ikke jeg er så dreven med html og css...

[saivert]

Det er også viktig å sette korrekt DOCTYPE for HTML dokumentet ditt.

Internet Explorer er veldig kresen når det gjelder DOCTYPE noe Mozilla-baserte nettlesere ikke er (som bruker Gecko rendering engine). Tror Opera også er litt kresen på DOCTYPE (har ikke testet skikkelig).

 

Internet Explorer støtter også en del ekstra egenskaper som de andre nettleserne ikke støtter. Dette er DirectTransform Filters som brukes via filter attributen i CSS. Med DirectTransform Filters kan du lage blokkelementer halvveis gjennomsiktig, lage spesielle overganger slik at webbaserte lysbildefremvisninger blir mer kule uten bruk av Flash.

Det finnes en del tillegg fra Mozilla på utviklerstadiet som erstatter noe av dette i Mozillas nettlesere, men jeg råder deg til å ikke bruke dette da det er en IE-only egenskap.

 

Mange utnytter tolkningsfeil i Internet Explorer for å forhindre visse CSS stiler fra å bli lest av Internet Explorer. Da kan man ha med en stil for Internet Explorer og en stil for de andre. Dette kalles CSS-hacks. Man kan også lage et PHP skript som gir en CSS til IE og en annen til Firefox/Opera basert på User-Agent strengen (men jeg har ikke sett dette bli brukt i noe stor utstrekning).

[YoYo]

Det er egentlig en uting å bruke CSS hacks for å servere forskjellige typer stylesheets. Mange slike hacks vil eksempelvis slutte å fungere i IE7 (eller fungere, uten at det er behov for det).

Jeg vil derfor anbefale at du heller tar deg tiden til å bruke css kode som passer i begge. Med noen få unntak, så er det stort sett noen få små endringer som fikser alt.

[Lovskogen]

Eller bruker conditional comments (google it).