I have the following to make the top-level menu space out across the top:

ul.rMenu li {margin: 1px 55px 2px 45px;}

I have the submenu width set to 18.5, the smallest I can have it without the background dropdown arrow go behind the text. The problem is there is 50 px of white space on the left of submenu text and like 65px on the right, forcing the second level sub-submenu items way off to the right. Seeing your posts, I've tried several things under the selectors;

div#menu1 ul.sub-menu, div#menu1 ul.sub-menu ul, div#menu1 ul.rMenu-ver, div#menu1 ul.rMenu-ver ul

like width: 14em;, smaller margins, negative margins, text-align: left;, background-position: right; ( to move arrows over) but everything seems to squeeze text and arrows together without getting rid of white space) On a prior post I had ul.rMenu li {width: 25%} on top menu then switched to margins as per above, and thought I had it solved with your help.

the site is: http://www.trcontemporary.com

Instead of margins to spread out the menus I have had success with using width's for the menu items using percentages.

Still driving myself crazy with this. I tried switching back to percentage width to spread the top menu;

ul.rMenu li {width: 25%}

But still end up having to widen the submenu to like 18.5em (or 250px wide via css inserts) to get the arrows from combining with the text--resulting in huge white space on both sides of the sub-menu items and the sub-sub menus flying way off to the right. I'm probably missing something obvious but just can't find it.

If you export your setting and attach to a post via the paperclip icon I will import and take a look.

Here are the settings, attached, I think. Thanks!

Hi Lmiles, if you get a chance, I'd appreciate a look regarding the width of the submenus. Thanks!