How to remove spacing between superfish menu ul and parent div

I have menu made with Superfish jquery plugin http://users.tpg.com.au/开发者_StackOverflowj_birch/plugins/superfish

But i have some problems with that, it is added padding when i view my page in Firefox, Chrome and IE:

Here is the jsfiddle sample http://jsfiddle.net/YsG97/2/ May be some one may suggest how to remove this spacing between Superfish menu ul and header div?

and there is strange thing i indecently find out, if i put &nbsp after menu closing tag: </ul>&nbsp; it is fixed spacing in Firefox, don't know why. May be some one may explain?

---

Here you go:

#menucontainer {
    ...
    vertical-align: top;
}

Live demo: http://jsfiddle.net/YsG97/5/

The #menucontainer DIV has display: inline-block set, which effectively makes it an inline element. Inline elements are by default aligned to the baseline, which means that there will be space below them (between the baseline and the descender):

http://vidasp.net/media/CSS-vertical-align.gif

---

If you add a clearing element after the closing ul tag, it matches up to the bottom. there is a problem with the floats, not sure what the problem is but this fixes it (although with increased height in the #menucontainer div.

See here.