Maha
Maha

Reputation: 493

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 chrome: the post is overlapping onto the comments section.

Can you help me fix that?

thank you

Upvotes: 1

Views: 863

Answers (3)

Joey
Joey

Reputation: 354864

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

Generally: Fix the markup errors first.

Upvotes: 1

thirtydot
thirtydot

Reputation: 228302

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

Upvotes: 2

ammianus
ammianus

Reputation: 488

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

Upvotes: 0

Related Questions