Page: http://www.spoc-ortho.com/test_jn.html
On this page, in Safari 3.1 on Mac OS X 10.5.2, a one-line gap appears between the menu bar and the drop-down menus — EXCEPT for “Employment”. All of the drop-downs should be as Employment, and not with the current gap as shown.
Looking at the code they all look the same, so I can’t figure out why I am seeing this gap. There are no line breaks in the markup, and all submenus have the exact same class so no variation in the code.
white space is set to nowrap.
More info:
I’ve tried the “son of suckerfish” menus and while they seem to work better, there are still problems.
http://www.spoc-ortho.com/test_jn2.html
Even after cleaning up the white space I still have the extra line after everything but “employment”.
Also, if someone who has IE6 SP2 could take a look at this, that would be great.
The CSS is:
http://www.spoc-ortho.com/menu/twotiermenu.css
and the JS is:
http://www.spoc-ortho.com/menu/sfhover.js

Looking at it, I don’t see anything wrong with the HTML code, my guess is it’s a possible problem with the CSS.
Try the Son of Suckerfish dropdown menus. They’ve always worked extremely well for me, and are much more lightweight. It’s 12 lines of javascript, versus 332 (Never liked the scripts included with Dreamweaver).
Good Call Website Hacks, he has 2 (and)nbsp; after the word in each of them, except employment. (My recommendation of Son of Suckerfish still stands though)
Check for white space.