Spry Horizontal Menu IE Position Issue

Report · Jan 23, 2008

I'm developing a site with a Spry Horizontal Menu. I want the menu links centered (ul.MenuBarHorizontal li) - the spacing looks so much better in this application. The only problem is in IE: the submenus end up starting from the center of the parent link - not centering the submenu entirely. If I set "ul.MenuBarHorizontal li"'s text alight to left the subs work ok, but the link spacing looks funny.

According to DW's help menu the sub menus are controlled by the following code, but I can make these values anything I want with no results.

/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
{
position: absolute;
margin: -5% 0 0 95%;

I have tried to find solutions online, but couldn't find one. An Adobe person thought maybe the centering of the entire menu might be the issue. I have experimented a bit with this (I am doing it with a table that is centered), with no changes.

The problem is in the CSS... Any ideas anyone?

The page can be seen here.
http://benjaminjamesclients.com/armistice/web/menuissue.php.

The Menu http://benjaminjamesclients.com/armistice/web/navigate.php

The page with Left aligned text... uck!
http://benjaminjamesclients.com/armistice/web2/

Any help is appreciated.

Report · Feb 08, 2008

I've been having problems with the horizontal menu in IE as well. I have discovered that to center the main menu items without having the submenu begin at the center of the parent item, put the "text-align:center" under "ul.MenuBarHorizontal a" rather than the "ul.MenuBarHorizontal li". I'm still working on making the submenu items look nice - I don't like them centered but if they are text-aligned left then they end up beginning far to the right of the parent item (because the parent is centered with respect to it's container).