Customizing the MOSS 2007 Drop Down Menu

While customizing the Top Drop Down Navigation Bar, you might notice some of the drop down items do not stretch all the way when you hover over them.  You will get a “two tone” effect, not exactly desirable.

Since I’ve run into this several times I figured I would share the CSS I’ve been editing to get around this:

The problem child:
The *width and min-width seem to cause trouble when you have long items. 

.ms-topNavFlyOuts a
{
display:block;
*width:120px;
min-width:120px;
color:#3764a0;
padding:4px 8px 4px 8px;
}

The Fix:
Pretty straight forward, remove or comment out those two properties.  Use width:100%; instead.

.ms-topNavFlyOuts a
{
 display:block;
 width:100%;
 padding:4px 8px 4px 8px;
}
Happy Customizing

 

This entry was posted in SharePoint 2007. Bookmark the permalink.

2 Responses to Customizing the MOSS 2007 Drop Down Menu

  1. Liam Cleary says:

    Hi Shane,
    Nice tip!! Will use now! Kepp up the good work. :-) Chat soon

    Liam

  2. Pingback: MOSS 2007, CSS, and you, the “Non-Developer” – Part 5: the TopNavigation and the SiteActions Menus « The SharePoint Mechanic