CSS Rollovers not working when in front of .GIF with a lower z-index

[organicg]

The site isn't live, so I can't demo it to you.

I'm using all CSS and no tables...hopefully.

I have a logo.gif with z-index:1, that is position:absolute; top:0; left:0; and a few nested DIVS that create a horizontal menu bar. All the nested DIVS have z-index >1. The menu shows over the logo, like it should, but the hovers do not work for the menu items that are in front of the logo. The hovers do work for the menu items that extend beyond the end of the logo.gif. Does anyone know why the first couple of hovers don't work?

 

[organicg]

As usual, I waited to ask for help until I really thought I was stuck, then figured out my problem right after posting.

My nested DIV menu layer did not have "position:absolute|relative;" set and so z-index was ignored. Because my logo.gif has a transparent background it gave the appearance that the menu was the top layer, however it wasn't. That's why the rollover didn't work...it only appeared to be on top.

I'm still trying to figure out the best way to lay this out, but that's not a question for right here and now.

 

[dwarfthrower]

What you've described works fine for me... perhaps a code snippet would enable more effective debugging of your problem.