Just IE6 PNG fixes? Mmm how about this?

We all hate IE6

This browser is crap and we all know it. Unfortunately, some clients demand support for this browser so we can’t avoid having some workarounds for it.

PNG Images

.png images have the best quality and fidelity for our web designs. Their best feature is their seamless and smooth transparency. We can achieve transparency with .gif files but their smoothness are not even close to .png files.

There are many times where our designs need a transparent .png and we also need to add support for IE6. So… what do we do?

PNG fixes to the rescue!

PNG fixes are mostly javascript (sometimes css) solutions for fixing IE6’s lack of transparency support for.png files. There are various PNG fixes. Here are some of them:

• Unit PNG Fix (JS)
• DD_belatedPNG (JS)
• Komodo Media’s PNG Fix (CSS)

The good thing about PNG fixes

1. They are easy and fast to setup.
2. They get rid of the problem in most cases.

Problems using PNG fixes

Well, unfortunately, it’s not everything as nice as cupcakes and rainbows. I’ve encountered some problems using PNG fixes:

1. Background-image support is quite poor (repeats and positions specially).
2. It’s a pain in the ass if you are using CSS sprites.
3. Sometimes the proportion of the images gets screwed up.
4. You add another javascript file to your page.
5. In CSS workarounds the code isn’t pretty and fails W3C’s validation.

Ok… so what now?

Well, I have my own workaround for transparent .png’s in IE6. Maybe you will like it, maybe not, but I wanted to share the technique in case it comes in handy for you.

I don’t use transparent PNG’s for IE6

That’s right. I use .gif files instead.
Sorry to dissapoint, but I believe this is the way to go.
The quality of our images decreases of course, but we are embracing and accepting the browser’s limitations.

Copyright: http://thecssblog.com/tips-and-tricks/just-ie6-png-fixes-how-about-this/