Hey peeps,

 

Having a nightmare with this menu I wrote. It's rendering fine in ff but as usual internet explorer is messing it up!

 

menu is here

 

Very grateful for any advice you can give.

I added a better doc type which helped alot but you can see that on the <li> that leads to a flyout that there is more spaceing then the normal list items. I've tried everything I can think of.

 

Has anyone come across this problem before?

do you mean the space above and below, I cant really see a lot of difference have you tried setting a height for your li

Well it's specifically IE7 causing the problem. (not so worried about IE6 for now), the li's that flyouts (training and sqaud) have extra space at the bottom of them in IE7. Renders fine in everything else.

IE 6 is not even showing your sub menus

 

Going back to the Spry menu. I had a horizonal one which had the same problem and the following css solved it:

 

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
{
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
ul.MenuBarHorizontal li.MenuBarItemIE
{
	display: inline;
	f\loat: left;

}
}

 

Maybe if you substitue MenuBarHorizontal with MenuBarVertical, it might work.

 

Good luck

Edited January 26, 201016 yr by Sam G
added [code] tags

Thanks again Kryptic,

 

Your time is appriciated, I'll give those suggestions a try now.

Apply a style to all LI's inside that menu, make them display as a BLOCK.

 

 

#menu li {
   display: block;
}

 

 

Also apply a block style to the actual links. (along with a 100% width)

 

html #menu a
{
   display:block;
   width: 100%
}

 

IE <8 browsers have their own way of rendering lists. So you'll need to pretty much set all UL's and li's to blocks or inline-blocks.

 

 

If that doesn't work use a conditional block for IE6 and wrap each UL with a table.

Problem solved, thankyou Krip!

You're most welcome!