One of the dropdown menus on my website is not retracting back properly, but only on the contact page where a Google map is displayed. The issue looks like this:
I've tried tweaking the CSS code without success. What could I be missing? Should I provide more information?
Here's the HTML code snippet in question:
<nav id=\"topmenu\" class=\"clearfix\">
<ul class=\"dropdown\">
<li class=\"menu-level-0 current-menu-ancestor\">
<a href=\"index.php\"><span>Home</span></a>
</li>
<li class=\"menu-level-0 current-menu-ancestor\">
<a href=\"aboutus.php\"><span>About Us</span></a>
</li>
<li class=\"menu-level-0 current-menu-ancestor\">
<a href=\"parts.php\"><span>Auto Parts</span></a>
</li>
<!-- More menu items here -->
</ul>
</nav>
The problematic dropdown menu is located under submenu-1.
Link to the CSS file: http://pastebin.com/1g74fqW1
Snippet from the contact page's HTML code:
<div class="body_wrap">
<div id="map-canvas"></div>
<div id="menuu">
<!-- Form and button elements here -->
</div>
</div>
CSS styling for the contact page components:
#menuu {
position: absolute;
background-color: transparent;
top: 100px;
left: 10px;
z-index:99;
}
#map-canvas {
height: 600px;
}
View the live contact page here: