jQuery hide IE mess up

Could anyone let me know why the hide and show boxes are playing up when you click contact?

They only do this in IE. I cannot seem to fix the problem.

This is the website: http://molossi.psm2.co.uk/

Thanks :)

EDIT: Here is a picture of on of the issues on IE.This is taken after I have clicked Contact then Cancel. I have zoomed out 开发者_高级运维to 75% to capture more.

It is working fine for me when I tested the link in IE...I think this css is causing the problem:

/*Win IE browsers - hide from Mac IE\*/
* html #main-nav { margin-top:20px; }
* html #main-nav li { display:inline; float:left; }
/*End hide*/

When you click on contact it shows a div below the navigation-bar and when you cancel it loads a separate div outside of navigation-bar div. So in your browser somehow the switching among nav-bar and outside div is not happening as it should be.

Try to concentrate on main-nav property of the css. Maybe line-height or margin-top or height is causing this.

You need to add a doctype in order to use Standards Mode and you should validate your HTML and CSS:

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fmolossi.psm2.co.uk%2F

http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fmolossi.psm2.co.uk%2F