View Full Version : PNG transparent images in IE

02-26-2009, 04:51 PM
My PNG transparent images have gray backgrounds in IE6 does anyone know how to fix this? Should I use .gif?

02-26-2009, 04:57 PM
You don't have to revert to GIFs. You'll have to use a little bit of JavaScript (http://www.twinhelix.com/css/iepngfix/) to get alpha-channel transparency (the kind PNGs use) to work in IE6.

02-26-2009, 06:39 PM
I saw some stuff about that but what if a visitor has java turned off, is there a work around for that? Thank you by the way for replying, I will use this method unless there is a better way to cover all possibilities.

02-26-2009, 07:07 PM
Negative. If a user has JavaScript (http://www.dannyg.com/ref/javavsjavascript.html) turned off, then you're SOL.

The script works well but isn't totally foolproof, either. I tried to use it recently when making a faux column (http://www.alistapart.com/articles/fauxcolumns/) layout in conjunction with a sticky footer (http://ryanfait.com/sticky-footer/), and the background image I had applied to #wrap and repeated vertically ran over the footer. So in that case I made a special background image for IE6, without the transparency, and resorted to good ol' conditional comments:

<!--[if lte IE 6]>
<link rel="stylesheet" href="css/ie6.css" type="text/css" />


#wrap {
background:url("../images/wrap_bg2ie.png") repeat-y;

It's not ideal but the visual difference isn't glaringly obvious. It's a judgment call.