January 18th, 2013AWM: Menu shifts down 1px in Firefox, it is fine in other browsers
Knowledge Base support case for AllWebMenus, abstracted and stripped of all user’s private info.
Initial Email From: Steve
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
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"> </div>
Even better, you could just center the menu to the <div>:
Likno Customer Support
Like us on Facebook – Follow us on Twitter
Reply From: Steve
That did it.