Or any other browser for that matter. We've all asked ourselves this at one time or another. Much of this is down to default stylesheets. Each browser has default ways of rendering everything, and, wouldn't you know it, they're often all different.
From the article...
One of the main causes for the many positional differences between layouts in various browsers is due to the default stylesheet each browser applies to give styling to certain elements. This usually involves setting default margins and padding to some elements to make them behave in a certain way.
For instance, paragraph (p) tags will have a margin applied to them so that each paragraph is separated by vertical white space and do not run into each other. The same applies to many other tags including heading tags (h1 etc). The problem occurs because the amount of margin (or padding) applied to these elements is not consistent across browsers. On many occasions Mozilla/Firefox will add a top margin to the element as well as a bottom margin. IE will however only add a bottom margin. If you were then to view these two browsers side by side you would see that the alignment would be different due to the top margin applied by Mozilla which could make your design not line up as expected.
In some designs this may not be a problem but in cases where position is important, such as aligning with other elements on the page, then the design may look bad or at least not as expected.
Here are some styles taken from the default Firefox 2.0 stylesheet (html.css) and immediately shows what is going on here:









