Knowledge Base support case for AllWebMenus,  abstracted and stripped of all user’s private info.

Initial Email From:
Initial Email Subject: Firefox menu vertical shift
Support Case Month: December 2012

I have a small problem. In fact, about 1 px small.
In Firefox, the menu I created shifts down by about 1 px. It displays fine in IE and Chrome and I've gone over all the sizes to make sure they 're right.
If you go to the website I list above and look closely, you can see that the actual menu which has about 120 px padding left and right, is sitting low in Firefox. I tried this on two different PCs with 2 different versions of Firefox and they both do the same thing. You can also see (if you look hard) that the highlighted menu item has about a 1 px margin at the top of the highlight (again, showing that the menu is shifting down by about 1 px.)
Any ideas what might cause this?
I can fudge it by adding 1 px to the menu bar background and no one would probably notice (except me). But, I rather not.

Reply From: Likno Customer Support

Dear Steve,

I checked your page and noticed that the <span> you use for positioning is 1px low in Firefox, hence the menu is lower too.

My suggestion is that you use the parent <div> for positioning and instead of adding a padding to move the menu, use its offsets:

<div id="navBar">&nbsp;</div>

menu position relative to element

Even better, you could just center the menu to the <div>:

center menu position relative to element

Best Regards,
Likno Customer Support
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Steve

You're good!

That did it.


Tags: , , , , , , , , , , , , , , , ,