What could cause the same browser on different PCs

Question

I'm stumped. A client and I are both running Firefox 3.0.12 on XP machines. We view the same page in the same browser on different machines and have different results. Note: All IE browsers are consistent on both of machines, and my FF 3.5.1 is consistent with my FF 3.0.12. (He does not have FF 3.5.x installed to compare with).

There is a 1 pixel difference that causes his header div (all images, no text) to wrap. Mine is fine. If I expand his header by 1 px (via Firebug css editing), it works.

So my question is what other variables are there that affect rendering??

I'm trying to think "outside the box" because it seems that it should work exactly the same.

We cleared the browser cache. I did a diff on the HTML source, and other than a javascript datetime stamp and a javascript tracking code var, the sources are identical.

I know this question would be helpful with source, but my client specifically does not want this page live on the internet yet. Also I verified the issue via a webex session. At first, I couldn't believe that we would have different results.

Anyone else come across something like this before? What should I check out / debug next?

Edit: There are a lot of suggestions pointing to fonts, but the header uses only images. Well, that's not completely true, there are divs that are part of a collapsible menu, but all of that is set to display:none for initially rendering, so I'm thinking that it's something else.

Edit 2: I've changed all sorts of fonts and sizes (both the system default font settings and within Firefox) on my computer to try to replicate the problem. I changed the rendering style (standard vs. clear type). Nada. The problem is almost definitely not font related. I'll have to see if I can get some more access to the client's computer to replicate the problem.

Answer 1

I'd compare plugins/addons.

Answer 2

DIfferent operating systems have different font rendering engines. Vastly different. More than enough to cause at least a 1 pixel difference, depending on how you set up your CSS.

Answer 3

IF you're using Firefox make sure you hit Ctrl-0 to default the zoom level.

Answer 4

Are you both using the exact same screen size? Does firefox try to scale the fonts to the apparent size of the person viewing the page, or to a specific number of pixels?

Answer 5

I saw this problem once, and as it turned out the user had zoomed the page, and the zoom caused math rounding issues. I had inadvertently zoomed my page to 120%, they had just your normal 100%.

Answer 6

I know my FF3.0 makes everything look different than other people's because I have it set in Preferences to use a minimum font size of 16. I dont get fine print, I get a pile of legible writing.

Also, being on a Mac, the default fonts are sans serif, whereas on windows everything is serif, which also can change the font widths and heights even further.

If anything on your page is specified with "em" or "ex" units, they are dependent on font size.