Div Tags in Front of Javascript Pull Down Menus
Posted on | September 19, 2008 | No Comments
I was working on a wiki for one of the Quest Communities called http://wiki.activeroles.quest.com. This wiki is using Media Wiki which is an Open Source wiki built on PHP. In customizing the look and feel to this wiki to make it look like its parent community site, I ran into an issue with the pull down menus created by the Quest web development team. The pull down menus worked great. However, when the menus dropped down, certain of the MediaWiki components insisted on being in front of the pull down menus.
In resolving the issue, I looked at both the CSS and the HTML layout of the media wiki components which were nothing more than div tags. I tried to solve the problems by modifying absolute vs relative positioning, modifying the z-index on the various components, and I was really tested on finding the solution. Then I found it.
The CSS attribute of the dominant div tags included overflow:visible; as attributes. For some reason, this attribute was forcing the div tag to be on the top layer.
/* overflow:visible; */
Problem solved.
Comments
Leave a Reply