Is there any difference between the box models of IE8 and Firefox3?

Question

What are the main differences (if any) between the box models of IE8 and Firefox3?

Are they the same now?

What are the other main differences between these two browsers? Can a web developer assume that these two browsers as the same since they (seem to) support the latest web standards?

Answer 1

The Internet Explorer box model has been "fixed" since Internet Explorer 6 so long as your pages are in standard compliants mode.

See: Quirks mode and Internet Explorer box model bug.

Until I learnt about doctype declerations getting IE to work properly was a real PAIN, because IE runs in "quirks mode" by default. So having a standards mode doctype will eliminate a whole bunch of the most painful CSS problems.

Answer 2

I would never assume that any browser renders a page exactly the same.. always test!

Even though they support standards, there are plenty of variations between different browsers and even different versions. FF1 renders differently to FF2 which renders differently to FF3.

You also have to remember that each browser has their own JavaScript engine which again, will cause some scripts to work and other to fail.

You can ofcourse reduce these differences by using CSS and JavaScript frameworks which have been developed to support multiple browsers.

However, you still must test in all browsers. There will always be something that doesn't quite look or behave right.

Answer 3

Things that will always differ between the two (and other browsers) are default values (font sizes in headings, for example). The way they achieve default visuals is often different, as well, such as whether or not they use padding or margin to achieve the indentation in bulleted lists.

Something quite positive that I just noticed is that IE8 finally fixes IE's handling of margin: 0 auto for block elements that you want horizontally centered in their respective parents.