Smooth Menu - changing position causes submenu problem in IE

[dmshep99]

1) Script Title: Smooth Navigational Menu (v1.3)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm

3) Describe problem:

Hi,

I am trying to use this fantastic menu for the first time and encountered a problem with positioning.
When the menu is positioned at the top of the page everything works great.
However what I would like to do is add a banner on the top of the page and have the menu directly below it, followed by another div with some actual site content.

How I was trying to go about it is to have a div for the banner (for now only a diff bg color) and then pull the menu via external html (as described in the DD tutorial) and then below it have another div with a different bg color for text for the site.

In order to drop the menu below the banner, I tried editing the css for the menu:

.ddsmoothmenu{
position:absolute; top:200px; left:0px;
font: bold 12px Verdana;
background: #414141; /*background of menu bar (default state)*/
width: 100%;
}

.ddsmoothmenu ul{
clear;
z-index:100;
margin: 0;
padding: 0;
list-style-type: none;
}

however when I do that FF is OK but IE6 and IE 7 hide the submenu under the div that follows it...see attached pic

How should I approach this to avoid this problem...

Thanks a bunch!!!

[ddadmin]

Is the content that's obscuring the drop down menus in IE6/7 just regular HTML content, or is it Flash/ Java etc? From the screenshot it appears as if the former.

[Snookerman]

Try adding this to your CSS code:

.ddsmoothmenu{
position:absolute; top:200px; left:0px;
font: bold 12px Verdana;
background: #414141; /*background of menu bar (default state)*/
width: 100%;
z-index: 1000;
}

Good luck!

[dmshep99]

It is a regular HTML content...

[dmshep99]

Hi,

Thanks for your suggestion, I managed to solve it by laying out other elements in a relative (vs. absolute) way...
It now works on both FF and IE6/7.

Thanks a bunch!