How To: Getting Transparent PNG's to work in IE6

[chuckroast]

As any pligg template developer will tell you getting things to look right for IE6 is a total pain because microsoft doesn't feel like they should have to abide by any sort of development standards.

One huge problem was that IE6 didn't render transparent PNG's correctly.

After poking out my eyeballs and ripping out my hair, I found the following solution.

First download the iepngfix.rar file below.

Extract the file and upload iepngfix.htc to the CSS folder of your template.
example templates/yget/css/

Now open your main css file (templates/yget/main.css)
and add the following code

img { behavior: url(iepngfix.htc); }

That is it. Clear PNG's will now work in IE6

This will also work with transparent backgrounds. So something like

#header { background:url(header.png); }

Could be used like this.

#header { background:url(header.png); }
img, #header { behavior: url(iepngfix.htc); }

Enjoy

[Darksat]

Well this seems to be enabled in the newer version of pligg but its breaking my embedded google maps, is there any reason I need to apply it so generally on the default yget template?
Regards
Mike

[blaze]

Chuck, will the fix also work for BOTH site urls (with and without the www), such as when a user types in the url http://www.yoursite.com rather than http://yoursite.com for pligg.

I only raise this question because this was the biggest issue that came up for many joomla templates with this iepng fix. The only work around was to make sure you used an exact path in the htc file and then made changes in the .htaccess to redirect all www calls to domain.com without the www (or vice versus, whichever method is preferred.)