PDA

View Full Version : Resolved Smooth Menu - changing position causes submenu problem in IE



dmshep99
05-08-2009, 06:41 PM
1) Script Title: Smooth Navigational Menu (v1.3)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.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 pichttp://shepdev.pcriot.com/submenu_IE_issue.GIF

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

Thanks a bunch!!!

ddadmin
05-09-2009, 08:21 AM
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
05-09-2009, 08:34 AM
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
05-11-2009, 10:47 AM
It is a regular HTML content...

dmshep99
05-11-2009, 10:51 AM
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!