View Full Version : CSS Driven Rollovers - Transparent BG Question

12-21-2006, 06:26 PM
Hey Guys,

I'm doing something similar to the following CSS rollover menu:


The CSS controls one master image that positions the rollovers as you see them when moving the mouse. As you can see, the top left corner of each block is a grey background color.

On my page, I have the main header as a background image, tiled on the x-axis. I redid the CSS background image to make the background transparent (removing that grey), and saved it as a PNG.

The problem I'm having is that the menu sits on top of the background header image, and isn't showing transparently to show my main header background image. Is there something I'm doing wrong?

Any suggestions would be appreciated.


12-21-2006, 06:28 PM
Do you have a link to your site so we can see the problem?? And IE hates transparent png's

12-21-2006, 08:08 PM
That was it. Made it a transparent GIF and it works fine.

Thanks for the tip.

12-22-2006, 10:34 PM
Nice template. :)

12-22-2006, 11:30 PM
Itís Internet Explorer 6 that doesnít support PNG variable transparency. Internet Explorer 7 does support such images. I think Internet Explorer 6 supports PNG(‐8)s (vs. PNG‐24) with on‐off transparency (like GIF) though.