csshover.htc menu IE problem

[LouPhi]

I'm using csshover.htc to create a pop-out menu - in Firefox it looks great, and it appears ok in IE7, however in IE6 and below the menu is rendering horribly - see http://www.athenecreations.co.uk/cf/

There are big gaps between each top level item, and then a gap when the sub-menus pop out, which means by the time you've moused across to the sub-menu, it disappears as it assumes the mouse has gone 'off' the menu!

Its v frustrating... any ideas??

Thanks
LP

JUST NOTICED: In Firefox, Safari and IE6< the sub-menu also cuts off after 10th item, which could be due to a 'min-height' setting in the stylesheet #content DIV:

#content {
width:100%;
margin-top:10px;
min-height: 380px;
padding-left: 2px;
clear: both;
overflow: hidden;
}
* html #content {
height: 380px;
overflow: hidden;
}

HELP!?!?!?!?!

[Centauri]

This is a common IE problem when the <a>s are set to block display with no width. The cure is to float the <li>s, which means their width will need to be set to 100% :#popout li {
position: relative;
float: left;
width: 100%;
}

[LouPhi]

Brilliant - thats fixed the problem with the gaps! Thanks for that.

Any ideas on why the sub-menus are cutting off, or more specifically what I need to do with the #content min-height to stop the #popout menu from displaying the full sub-menus if they run further than the min-height?

If you hover over the top level menu item for 'Audit' this should have 14 items in, IE displays them all, but Firefox/Safari both cut off....

In fact... IE6< cuts EVERYTHING off (ie, other pages too) so seems to be ignoring the min-height. In fact, I'll raise this as a new thread :O)

Thanks again
LouPhi

[Centauri]

It is the overflow:hidden that is the problem - removing that should fix it.
#content {
width:100%;
margin-top:10px;
min-height: 380px;
padding-left: 2px;
clear: both;
overflow: hidden;
}
* html #content {
height: 380px;
overflow: hidden;
}

[LouPhi]

So simple.... I should have been able to work that out for myself - sometimes you're so close to something to you can't see what it is!

Thanks for your help!

Lou

[LouPhi]

I've noticed another problem in IE6<...

When a sub-menu is displayed, after mousing across to the sub-menu it only stays visible while the mouse is on the top item, any further down and the sub-menu disappears!!!

Any ideas how to keep the sub-menus visible so that all the options can be selected??

LP