#32: Using the Unit PNG Fix
Designing using alpha-transparent PNGs makes life so much easier and cooler designs possible. As we are all painfully aware, IE 6 and under do not support them. They display... but any areas of alpha transparency get turned into nasty blue-gray and are anything but transparent. There is a way to force IE to respect the alpha transparency though, commonly referred to as the PNG hack. There are various methods, all boiling down to the use of a proprietary Microsoft CSS "filter". A newcomer on the scene is the "Unit PNG Fix" which is ridiculously easy to use. Simply link up a very tiny JavaScript file in your header and you are done!
Links from video:
There are some drawbacks however.
You can’t use background-position and background-repeat.
I love you..!
Chris – evidently, Unit Interactive moved the link to the Unit PNG Fix. The link you have listed is dead. Here is the correct link:
http://unitinteractive.com/labs/unitpngfix.php
Fixed, thanks. That’s pretty insane of them to have not set up a redirect at least.
By the way, this is the new cool kid on the block for the PNG fix:
http://dillerdesign.com/experiment/DD_belatedPNG/
Very nice. I can’t wait to test it! Thanks for the tip!
Very cool. Thanks Chris!
The Unit Interactive site says that ” the CSS sprite technique will not work for pngs in IE6, when using the Unit PNG Fix.”
What would be the best way to use transparent PNGs for a CSS sprite menu?
Thanks again!
lol that comment “Whats wrong with your website” was too funny !! :P
Thank you Chris! Greetings from Craiova, Romania!