have problem of Drop Down Menu Overlaps with Image Map of my Website. This happens when I click on Top menu bar (drop down).

The expected output is, the drop down menu should appear above the map.

I am having problems with structure of the webpages in different browsers. for one browser it will display correctly for another browser like IE or Mozilla it will not display exactly. Do we have any browser compatibility code (in html or javascript or css)

Recommended Answers

I'm guessing your HTML utilizes DIV containers, so using CSS, change the z-index of your containers.

#menu{
/*Other code bla bla*/
z-index: 1;
position: absolute;
}
#map{
/*Other code bla bla*/
z-index: 2;
position: absolute;
}

You will now need to specify height parameters for these containers, …

Jump to Post

All 3 Replies

I'm guessing your HTML utilizes DIV containers, so using CSS, change the z-index of your containers.

#menu{
/*Other code bla bla*/
z-index: 1;
position: absolute;
}
#map{
/*Other code bla bla*/
z-index: 2;
position: absolute;
}

You will now need to specify height parameters for these containers, and they should be wrapped/nested in another DIV parent container which should have a position:relative.

It's best that in your HTML, your menu DIV container precedes your map DIV container.

thank you CJesusSaves
it works like magic

Thanks CJesusSaves a lot..really very nice code snippet..it worked in one shot..

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.20 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.