I'm trying to put together a CSS menu for one of my sites. I've got it working in IE (kinda), but not at all in FF. AT least in IE the drop down works and all options are shown. But in both IE & FF the menu does not center in the page, and the link under "Shelby", there should be a pop-out when you hover on the "movies" link, but it just drops down not out to the side like it should. But in FF nothing works at all. I'm at a loss.

Here's the link to the domain I'm using for testing.

And here's a link to the CSS I'm using.

My eye's have had it, I need a fresh set to look at this. I used a tutorial at Tanfa to put this menu together. I've looked it over and went through the tutorial and have a basic understanding of how it works. And I've customized it for my site. But I can't find the problem.

Also while I'm at it, the z-index is set so the drop downs will drop over the page content. But at least in IE, it just pushes the content down. I tried setting the z-index for the page content, but it didn't work. Is this an IE thing, or is the CSS coded incorrectly?

Help!

I have discovered that if you hover over the far left portion of the 1st <h2> in the menu, it does drop down in FF. But none of the other <h2>'s work, and only a portion of the 1st <h2> is active.

Hmmm...now I'm really confused.

With a little dinking around (yes, that is the technical term), I found that the "nav" element was sitting under the "content" element so the menu was in essence hidden and unable to be activated. By setting the z-index of the "nav" element, that took care of that. But the menu still won't center, and the pop-out under "Shelby>Movies" doesn't pop out to the side, it just drops down. And the drop downs still push down the content instead of just dropping over it.

It's getting closer, but there's still a few minor problems.

Excuse me for thinking out loud here, but could it be that since the "nav" element and the "content" element are children of the "main" element, be the reason that when the drop down is activated, it pushes the content down instead of flowing over it?

Nevermind, I got the dropdowns going over the content now. All I need to do is still center the menu and get the pop-out for "Shelby>Movies" to pop out to the right spot. It pops out, but it doesn't go where it should. It pops out to the right, but up against the next heading, not straight out to the right like it should.


Okay, all is fixed except for the centering of the menu. I don't know if it can be done, but I've managed to fix all of the other issues while still retaining most of my hair. Any suggestions?