You can't have additional space because the mouse needs to be continuously hovering over some portion of the menu. If you tried to move the pointer across a gap between menu items, it would cease to be hovering anything and the sub item you were trying to move the mouse to would vanish as soon as the pointer reached the gap.

You can try overlapping things. The following changes seem to work with sub menus, but I don't know about sub-sub menus or sub-sub-sub menus, etc. As Tom warned, this can have unexpected results.

At about line 62 of the css you have this rule:


You can try reducing the left value and increasing the top value:

If you want multiple menus on the same page, each can have its own style sheet. Just make sure you specify a unique name for each menu when you create it. For instance, you already used the name "menu" when you created the css menu on your test page.

Hey Cary... The reason I ask is because I've created 2 or 3 .mnu files but haven't noticed anything new in my css folder. Same 'menu-menu.css' is there so that's to say that this menu-menu.css should serve for a whole host of menus ??? I'm new to CSS but I might have thought that a new css file would be created for each new menu file. As I recall, the DHTML builder allowed you to adjust the length AND width of a menu bar. I haven't seen that in the CSS builder so thought about trying to find it in the css file (a spot to adjust the width of menu bars).

If all your menus are called "menu", then they will all use the same style sheet and look the same. If they have different names, they will use different style sheets, allowing you to make each menu unique looking.

I'm not sure which width in the css you would have to adjust. You just need to play around with them and see what happens. Good luck