Positioning problem in IE only

[Artisan]

A v10 site (http://www.personalproductivity.co.uk/) that I've just launched for a client has a strange problem - the header layout is fine in Firefox but has a big gap under the logo bar when viewed in IE. As it's OK in FF, I can't use Firebug or any of the Web Developer tools to troubleshoot it.

The site is basically the Hotshot theme with some modifications and all the code and CSS are both fine as far as I can tell. I've attached a screenshot of each for anyone who hasn't got both browsers.

Can anyone shed any light on this? I'm tearing out what's left of my hair!

Malcolm

[leehack]

hotshot-logobar is set to 103px height, hotshot-logo is set to 90px height with a 15px bottom margin, that doesn't add up correctly. You also have overflow: hidden; on hotshot-logo, no need for that if you code with correct sizes and it's one of the biggest elements to cause problems, try not to use it on stuff like this, usually a cross browser disaster.

[Artisan]

Thanks for the suggestions, Lee, I've tweaked the sizes to fit and removed overflow: hidden; but it's still pretty much the same. I can't upload to the client's live site so I've uploaded to http://www.artisan02.co.uk/

[leehack]

What happens if you remove the <p> tag from around the site nav links, doesn't seem to be adoing anything anyway. Gonna be a case of trial and error, i'll just point out things that seem wrong or don't seem to be doing anything.

[Artisan]

What happens if you remove the <p> tag from around the site nav links

The nav links lose their horizontal spacing - I've also tried the different types of "clear" after "hotshot-logobar" but they either added space or did nothing.