Strange centering issue in Firefox and IE8

Question

The navigation bar on my site http://hungryathome.net is not properly in Firefox and IE8 Standards mode. It works correctly in IE7 compatibility mode and in Chrome.

It is odd that setting Margin on div (id = "navlinks") to 4px or more will lead to the correct center. Any less will cause it to be slightly off center. I changed values ​​in Firebug and it baffles me. Any explanation of why this is happening?

Answer 1

Aha, looking at Firebug using its amazing controls that overlay blue elements, your title image actually hangs about 3 or 4 pixels above the navigation bar, which makes it move the navigation and actually make it smaller, so it centers it " correctly". Try to make your title a few pixels higher until it clicks into the correct position.

example http://img809.imageshack.us/img809/9784/example.jpg

EDIT: Or apply a style border: 0to this image so that it does not add a border around it, may be a better solution ...