CSS z-index

They have: 121 posts

Joined: Aug 2008

Hi Guys,

Think I've got a z-index issue but I'm struggling to resolve it. It works fine in FF but IE7 has problems. Take a look at the link and you'll see that the mootools dropdown menu drops behind my content. I've fiddled around with the z-index but no luck. can anyone see what z-index value should be where to make it work?

Thanks,

serpico

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

URL please?

They have: 121 posts

Joined: Aug 2008

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I was able to correct this by removing the position: relative on the content div's. Not sure if that will cause other problems for you - it looks to be okay in IE 7/Win and FF/Linux.

greg's picture

He has: 1,581 posts

Joined: Nov 2005

Megan wrote:
I was able to correct this by removing the position: relative on the content div's.
As z-index only works on things with positions (relevant, absolute), doesn't that basically stop the Z-Index from working on that container then?

So removing the z-index fixes the issue..?

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Did you check the code? Because I don't see a z-index on the content containers. Adding one didn't help (unless that wasn't working with the IE developer toolbar...). This isn't actually a z-index issue from what I can tell.

By the way, this problem is fixed in IE8.

greg's picture

He has: 1,581 posts

Joined: Nov 2005

My bad. I didn't check as it's a mess around for me to fire up internet explorer.

I just presumed with the OP stating it was a z-index issue, and you fixing the issue by removing the position, meant it was a z-index issue.

I know, presumption is the ... [insert Sam L. Jackson quote]

They have: 121 posts

Joined: Aug 2008

Cheers! You're a star. I removed all the position relatives and it fixed the problem.

But im not sure i get it. How does position relative effect the z-index attribute?

serpico

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

In this case the problem had nothing to do with z-index (the z-index on the horizontal-menu div isn't needed). I don't know why position: relative solved the problem - another IE mystery.

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.