How do you create a right-aligned suckerfish menu where top link is variable-width?

I have created a Son of Suckerfish (http://htmldog.com/articles/suckerfish/dropdowns/) CSS-based nav menu. The left side is normal Suckerfish where the top-level nav entry is the same width of the drop-downs.

On the right side of my menu I have several small icons for things like help and options that also have drop-down menus. The problem is I need to right-align them so they开发者_开发技巧 do not go off the page, because the icons are narrow and floated right.

Word picture time :)

_______________________________________________________
| menu-item    | menu-item    |       ____________| ? |
--------------------------------------| help item 1   |
                                      | help item 2   |
                                      | etc           |
                                      -----------------

What I did somewhat successfully was apply negative left margin to the inner that holds the drop-down entries:

#nav li ul { width: 10em; margin-left: -10em; }

There's one problem, it ends up too far left:

_______________________________________________________
| menu-item    | menu-item    |  _________________| ? |
---------------------------------| help item 1   |-----
                                 | help item 2   |
                                 | etc           |
                                 -----------------

A simple solution would be to base my widths on px instead of em and reduce the negative left-margin by the width of my icon (16px), but that is hacky. It won't handle font zooming. Another trick I thought up would be to use margin-left:-9em; and make my icon element width:1em; but that seems a little wonky too. I'm hoping someone has a better idea!

---

Ok, I put together a fiddle for this and found a solution... See my fiddle http://jsfiddle.net/cssguru/7JMkp/. Didn't have time to verify in all browsers. Probably some IE tweaking needed.