Question

I am having a stupid issue with a Joomla Menu Module called Maxi Menu. Here is a screenshot:

Link to website

The problem seems to be caused because of z-index. I have checked using firebug, but haven’t been able to found out how the lower menu is finding its way to show up on top.

The interesting fact is that after a menu item is hovered, its z-index is changed to 15000 higher than any other menuitem on the page.

How is it still going under the other menu items with 12000 and similar z-indices?

Firbug display of the z-indices:

Answer 1

Add position:relative to the two divs that have z-index 10 and 20.

Z-indexing is calculated relative from the first parent that has a non static position (absolute, relative, fixed).