Z-index problem with dropdown menu and elements with display hidden

I just added superfish to my page. But the drop down menu displays under my header-bottom div which has display: hidden. But that's not the only problem it is also covered by my Easy Slider which has images and divs and I can't tell which 开发者_开发知识库one is covering my drop down menu.

I'm not very familiar using z-index What's the best way of solving this?

Check that container, which contains your menu has relative position. Z-index works only for elements, which has position attribute 'relative' of 'absolute'.

For example:

<div style="position:relative">Menu here</div>

Add z-index property on both elements through CSS. (menu) and (slider)

<div style="z-index:2;">Menu</div>

<div style="z-index:1;">Slider (or whatever coming after the menu)</div>

and yes, the reason is using two elements with the position:relative;