Site looks messy in IE but it look ok in Firefox

[Fivestars]

Hi there,
I have just uploaded me new website for my business www.thepatpeople.co.uk but it looks very messy in IE, the position of the header is to the left and not indented. The nav bar seems to move if you hover over it. The image is not displayed and the text in the paras are in bold.
When I look at the site in firefox it looks how I thought it would.

When you look a the code you see I am not a web designer but I would be grateful for any help you experts can offer.

Thanks in advance.

[SoulScratch]

This should make it more consistent:

     * { 
	 margin:0;
	 padding:0;
     }

     div#head img {
	 display:block;
     }
     div#head h1 {
	 margin:0; padding:0;
     }

     div#head h3 {
	 margin:0; padding:0;
     }

     div#main { width:750px; }

     h2 {
	 margin-bottom:0;
     }

The main issue is you are relying on default spacing given from browsers and they vary. I used a universal reset and reset some margins manually, this makes it much more consistent for my local copy of the page.

[Fivestars]

Thank you for your help, I validated the code the causing the problem. It was a piece of code in the head for IE 5.5. I removed it and the header, and nav bar don't move any more.

Thanks

[newostar]

I've been using a web editor that always screws things up in either IE or Firefox, and it's never consitent, it's so frustrating....