Ett av de största dilemmanna för webbutvecklare är inkompatibiliteten hos olika Internet Explorer-versioner med nuvarande webbstandarder. Även om Microsoft har lovat CSS3 och till och med HTML5-stöd för IE9, kan Windows-användare, särskilt företag, fortsätta använda IE8, IE7 eller till och med den fruktade IE6 i många år framöver.

Som en följd av detta kommer en kodning av en webbplats med exklusiva CSS3-funktioner endast att alienera en stor del av webbplatsens besökare och förplikta dem att ladda ner en standardkompatibel webbläsare, som Mozilla Firefox eller Google Chrome, kommer bara att stöta på som arrogant.

En möjlig lösning på problemet är att använda en modernizer, som är ett skript eller en applikation som använder en mängd olika tricks för att få din webbplats att visas som den ska i alla webbläsare. CSS3 Pie är en javascriptbaserad modernizer som hjälper Internet Explorer känna igen coola CSS3-funktioner som avrundade hörn, mjuka droppskuggor och gradientfyllningar. Det är snabbt, enkelt och fungerar mest av tiden med mycket lite tweaking.

Installation och installation

Denna korta handledning förutsätter att du redan har en webbplats med CSS3-element. För att få CSS3 Pie att fungera måste du göra två saker: ladda upp javascript-paketet och lägg till specialkod i din CSS-fil.

1. Nedladdningen från webbplatsen css3pie.com innehåller ett antal filer, men om allt går som planerat är allt du behöver PIE.htc, vilket är en komprimerad textfil. Ladda upp den till en plats på din webbserver där din CSS-fil kan få tillgång till den.

2. Öppna din CSS-fil i din textredigerare och leta reda på de element som innehåller CSS3-egenskaper. Inom dessa delar lägger du till följande regel:

 beteende: url (PIE.htc);

Vägen till din PIE.htc-fil måste vara exakt, så om den inte finns i samma katalog som din CSS-fil, ändra den därefter.

Det sista elementet ska se ut så här:

 # element1 {border: 1px solid # 696; vaddering: 60px 0; text-align: center; bredd: 200px; -webkit-gräns-radie: 8px; -moz-gränsen-radien: 8px; gränsstråle: 8px; bakgrund: # EEFF99; beteende: url (PIE.htc); }

Om det fungerade korrekt bör du se resultaten i IE 6, 7 och 8 omedelbart efter uppladdning av den ändrade CSS-filen.

Felsökning

Om du inte ser några förändringar alls kan du mycket troligt behöva justera sökvägen till din PIE.htc eller ens använda hela webbadressen. Kom bara ihåg att IE bara accepterar en htc-fil från samma domän som webbplatsen, och "www.site.com" och "site.com" betraktas som två olika domäner.

Under vissa omständigheter kan du behöva försöka PIE_uncompressed.htc eller till och med PIE.php för att få det att fungera korrekt. Mer information finns i dokumentationen.

Jag har märkt att kombinationen av öppenhet och fet text resulterar i några galena ord i IE8. Du kan fortfarande behöva använda transparenta bildbakgrunder i dessa situationer.

Kombinationen av CSS3 Pie och vissa jQuery-funktioner verkar ge upphov till ett fel i IE. Jag har inte hittat en lösning för detta, men sidan laddas fortfarande och visas korrekt trots det.

Modernisering

Med mycket liten ansträngning kan CSS3 Pie hjälpa din webbplats att se konsekvent tilltalande i alla större webbläsare, utan huvudvärk att behöva forma hörnbilder eller göra falska droppskuggor. Sidans framsida innehåller en demo så att du kan justera CSS3-egenskaper och se liveresultat i Internet Explorer. Bäst av allt CSS3 Pie är gratis och öppen källkod och tillgänglig för nedladdning utan kostnad.