z-index issue with drop down menu

[kneidels]

Hi folks

i know this should be an easy fix, just giving the drop down menu a high z-index. i have given it an index of 300 and it still appears below a nivo slider. i have given the nivo container an index of 1.
i see it appearing this way in IE7, though my client swears he see it in IE8 too and also IE9.

my url: bit.ly/LhL19G

any ideas?

Thanks!!

[weegillis]

Not getting any of the described behavior in IE 9 / Windows 7. Executes same as Chrome (19.0.1084.46 m). Will check on an IE 8 box in the next day; see what appears.

The thing to be aware of is that z-index is not recognized until IE 'has layout'. This could be an issue not present in IE 9, but still prevalent in earlier versions. Make sure to declare the parent as having one of the 'has layout' trigger properties; 'position: %1;' comes to mind.

---------- Post added at 02:42 AM ---------- Previous post was at 02:29 AM ----------

My question is, why is this posted in an HTML5 forum when the URI sports an XHTML doctype? I fail to understand this.

---------- Post added at 02:52 AM ---------- Previous post was at 02:42 AM ----------

Addendum: the Parent could well be any parent in the cascade. Even the body.

CSS

body { position: relative; }

This might be the fix right here.

---------- Post added at 02:55 AM ---------- Previous post was at 02:52 AM ----------

The key is to declare the position property (the 'has layout' trigger) BEFORE the z-index property.

[barry100]

isnt nivo positions absolute? if so this will be the issue. Absolute things are not z-indexable. Try relative positioning for everything and you should be ok. if not then post back here and ill give you a hand.

- - - Updated - - -

Not getting any of the described behavior in IE 9 / Windows 7. Executes same as Chrome (19.0.1084.46 m). Will check on an IE 8 box in the next day; see what appears.

The thing to be aware of is that z-index is not recognized until IE 'has layout'. This could be an issue not present in IE 9, but still prevalent in earlier versions. Make sure to declare the parent as having one of the 'has layout' trigger properties; 'position: %1;' comes to mind.

---------- Post added at 02:42 AM ---------- Previous post was at 02:29 AM ----------

My question is, why is this posted in an HTML5 forum when the URI sports an XHTML doctype? I fail to understand this.

---------- Post added at 02:52 AM ---------- Previous post was at 02:42 AM ----------

Addendum: the Parent could well be any parent in the cascade. Even the body.

CSS


body { position: relative; }

This might be the fix right here.

---------- Post added at 02:55 AM ---------- Previous post was at 02:52 AM ----------

The key is to declare the position property (the 'has layout' trigger) BEFORE the z-index property.

cool.. just seen you posted the body was absolute.. why would this be? i dont know but this is defo the issue.