Et af de største dilemmaer for webudviklere er uforeneligheden af ​​forskellige Internet Explorer-versioner med de nuværende webstandarder. Selvom Microsoft har lovet CSS3 og endda HTML5-støtte til IE9, kan Windows-brugere, især virksomheder, fortsætte med at bruge IE8, IE7 eller endda den frygtede IE6 i de kommende år.

Som følge heraf vil kodning af et websted med eksklusive CSS3-funktioner kun fremmedgøre en stor del af dine websites besøgende og forpligte dem til at downloade en browser, der opfylder standarderne, som Mozilla Firefox eller Google Chrome, vil kun komme på tværs som arrogant.

En mulig løsning på problemet er at bruge en modernizer, som er et script eller en applikation, der bruger en række forskellige tricks for at få dit websted til at blive vist som det skal i alle browsere. CSS3 Pie er javascriptbaseret modernizer, der hjælper Internet Explorer med at genkende kølige CSS3-funktioner som afrundede hjørner, bløde dropshadows og gradientfyldninger. Det er hurtigt, nemt og virker mest af tiden med meget lidt tweaking.

Installation og opsætning

Denne korte vejledning forudsætter, at du allerede har en hjemmeside med CSS3 elementer. For at få CSS3 Pie-arbejde, skal du gøre to ting: Upload javascript-pakken og tilføj specialkode til din CSS-fil.

1. Downloaden fra webstedet css3pie.com indeholder en række filer, men hvis alt går som planlagt, er alt hvad du behøver, PIE.htc, som er en komprimeret tekstfil. Upload det til et sted på din webserver, hvor din CSS-fil kan få adgang til det.

2. Åbn din CSS-fil i din teksteditor og find de elementer, der indeholder CSS3-egenskaber. Inden for disse elementer skal du tilføje følgende regel:

 adfærd: url (PIE.htc);

Stien til din PIE.htc-fil skal være præcis, så hvis den ikke er i samme mappe som din CSS-fil, skal du ændre den tilsvarende.

Det endelige element skal se sådan ud:

 # element1 {grænse: 1px solid # 696; polstring: 60px 0; tekst-align: center; bredde: 200px; -webkit-grænse-radius: 8px; -moz-grænse-radius: 8px; grænse-radius: 8px; baggrund: # EEFF99; adfærd: url (PIE.htc); }

Hvis det fungerede korrekt, skal du se resultaterne i IE 6, 7 og 8 umiddelbart efter upload af den ændrede CSS-fil.

Fejlfinding

Hvis du slet ikke ser nogen ændringer, kan du meget sandsynligvis nødt til at justere stien til din PIE.htc eller endda bruge hele webadressen. Bare husk, at IE kun accepterer en htc-fil fra samme domæne som webstedet, og "www.site.com" og "site.com" betragtes som to forskellige domæner.

Under nogle omstændigheder må du muligvis prøve PIE_uncompressed.htc eller endda PIE.php for at få det til at fungere korrekt. Se dokumentationen for yderligere oplysninger.

Jeg har bemærket, at kombinationen af ​​gennemsigtighed og fed skrift resulterer i nogle vanvittige ord i IE8. Du skal muligvis stadig bruge gennemsigtige billedbaggrunde i disse situationer.

Kombinationen af ​​CSS3 Pie og nogle jQuery funktioner synes at frembringe en fejl i IE. Jeg har ikke fundet en løsning til dette, men siden loader stadig og vises korrekt på trods af det.

Modernisering

Med meget lidt indsats kan CSS3 Pie hjælpe din hjemmeside til at se konsekvent attraktivt i alle større browsere uden hovedpine for at skulle danne hjørnebilleder eller lave falske dropskygger. Forsiden på webstedet indeholder en demo, så du kan justere CSS3 egenskaber og se de levende resultater i Internet Explorer. Bedste af alt CSS3 Pie er gratis og open source og kan downloades uden omkostninger.