PDA

View Full Version : Problem with chrome menu in IE7



designergav
10-04-2007, 10:06 AM
1) Script Title: Chrome Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm

3) Describe problem:
In IE7 when you hover over the main link the menu appears but as you try to selcet one of the dropdrop links the menu disappears. It's as though it's not seeing the whole div as a rollover.

I'm using images rather than text could that be the problem - maybe with no background it doesn't know there is a clickable area?

It works fine in all other browsers including IE6. Any ideas?


SOLVED I had changed the .dropmenudiv style to z-index:3; and it must have been hiding below some other content. I changed it back to 100 and now works perfectly.
Thanks to DD by far the best CSS/Menu site around.
Ta
DesignerGav

ddadmin
10-04-2007, 10:37 AM
It has something to do with your modification of the styles for the drop down. If I reinstate the default rules:


.dropmenudiv{
position:absolute;
top: 0;
border: 1px solid #BBB; /*THEME CHANGE HERE*/
border-bottom-width: 0;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
background-color: white;
width: 200px;
visibility: hidden;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); /*Add Shadow in IE. Remove if desired*/
}


.dropmenudiv a{
width: auto;
display: block;
text-indent: 3px;
border-bottom: 1px solid #BBB; /*THEME CHANGE HERE*/
padding: 2px 0;
text-decoration: none;
font-weight: bold;
color: black;
}

* html .dropmenudiv a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
background-color: #F0F0F0;
}

The menu works again in IE7. Try experimenting to see what your version is missing that is causing the problem in IE7. IE7 has a few subtle CSS bugs, so something that may not seem related can in fact be the cause.