Easy fix for the transparent png issue in IE.
It’s true that I’ve decided to do not bother me to make the things work for Internet Explorer 6 and/or lower, always there is the need to attend client’s requests for the worst web browser ever. In this case, to to the problem witn transparency in PNG images.
To fix this bug we should download this file. After uncompress it we should include the iepngfix.htc and blank.gif files in your web server, then edit the iepngfix.htc file to indicate where you uploaded the blank.gif file. Also, we can read the iepngfix.html page to check how to use it ;-).
With this tool we can fix both the images in and the background images used with CSS; to do that we should add the below line in our css:
1 | behavior: url(iepngfix.htc); |
Keep on mind to set the right url to the iepngfix.htc file.
If we wish to make the tag to respect the transparent background in IE, we should add:
1 2 3 | img{ behavior: url(iepngfix.htc); } |
If we have a css element with a background image, we should add the behavior to it, for instance if we have a class named .logo, we should add:
1 2 3 4 | .logo{ background: url(images/logo.png) no-repeat left top; behavior: url(iepngfix.htc); } |
Well, that’s it! 🙂