IE8 CSS Negative Margin Pulling Up Parent Element

I am using a negative margin to pull up an <li> for a overlay effect. This effect works in all browsers, including IE7, but does not in IE8. IE8 seems to pull the entire <ul> up -4px (the negat开发者_如何学JAVAive margin height)

I am done trying to fight it and would appreciate any recommendations by this community on how to resolve this. I'd prefer to stick as closely as possible with my current styles as position:absolute can cause z-index problems in IE7. Here's the page - http://actorstheatre.org/. It's the main navigation at the top.

Have you tried position:relative;top:-4px; instead?

If it's only in IE8 you can force it into IE7 compatiblity mode.

<meta content='IE=7' http-equiv='X-UA-Compatible'>

http://msdn.microsoft.com/en-us/library/ms533876.aspx