divs appearing different on different browsers

This page is appearing perfect on firefox, but differently corrupt on IE & chrome: http://camethra.com/?p=76.

on IE: the whole container div is right aligned.

on c开发者_C百科hrome: the post is overlapping onto the comments section.

Can you help me fix that?

thank you

---

The other answers are correct, but not quite there.

Your page is rendering in Quirks Mode in IE, and that's why it looks broken in this browser.

The reason you're getting Quirks Mode is the two UTF-8 byte order marks at the start of your file:

ef bb bf ef bb bf 3c 21 44 4f 43
.  .  .  .  .  .  <  !  D  O  C

You'll need to save your file without this. It should be an option in whatever editor you're using.

To fix Chrome, you should fix the validation errors, particularly the ones like this:

end tag for "ul" which is not finished

---

For IE: Remove the whitespace before the doctype. It causes IE to fall back to Quirks mode.

Generally: Fix the markup errors first.

---

In IE8 your document is being viewed in Quirks Mode. (open the page in IE8, press F12 to enter IE's Developer Tools, the Document Mode currently chosen by IE is on the top right). You probably have some XHTML or CSS that IE believes is not valid causing it to render in Quirks Mode by default.

http://www.quirksmode.org/css/quirksmode.html