PDA

Click to See Complete Forum and Search --> : Hi PNG and IE6


cman
01-18-2007, 10:52 AM
Hi
My website has a vertical degrade and a centered main box which I called "main".
I'm trying to apply a 90 degrees shadow (showing the shadow at both sides; left and right).

Doing the degrade I have no problem, to make the shadow I saved a 1 pixel horizontal slice of a shadow picture as PNG, applied it on the "main" background and repeat-y CSS. Till here there's no problem. When I render it on Firefox it renders perfect. The problem is when I render it on IE6, the transparency of the PNG appear white instead of the degrade background.

Is there a way to solve this? I did a little investigation and it seams that IE6 as problems for rendering the PNG opacity .

What the hell is bill gates doing with all is money???

Cyan_Ide
01-18-2007, 02:40 PM
I don't know what background you have behind it, but first let me see if I can clarify. You have something with drop shadows on either side that decay horizontally? If I'm off base here, you can ignore everything else.

Yeah, IE6 has PNG transparency issues, don't worry, I completely spazzed on that yesterday at work and made some PNG's only to have that wonderful shade of blue come up in the background. Oops. Anyway, if you have a background that is a simple repeating image, or a color, you can make an image of the background with the shadow and include the shadow as part of the background slice that you make. Otherwise if you need to sit it on top of a more complex background, would it be possible to use a GIF?

I hope my suggestions helped!

cman
01-18-2007, 03:37 PM
That's the problem, I don't have neither a repeat-y image or a solid color.
This is my conclusions: shadow at 90 degrees + vertical gradiant + IE6 don't combine together. Firefox does it fine but the ******* IE6 don't.
Soluton: getting rid of the shadow or the vertical gradient.

Any other ideas?

chris_bcn
01-18-2007, 07:21 PM
IE6 doesn't support ong alpha transparency - IE7 does though. YOu can either serve a different inmage to IE6 by using advanced selectors (which IE6 doesn't understand) or by serving IE6 a different stylesheet visa conditional comments (the easiest way)

can you give us al ink so I can see exactly what the problem is?

cman
01-19-2007, 02:16 PM
I found the solution here:
http://www.webdeveloper.com/forum/showthread.php?t=125373#post655131
http://homepage.ntlworld.com/bobosola/pnghowto.htm

Thanks anyway!