I'm having this weird behavior: Firefox (4.0.1, Debian version) is showing the same exact page with two different font sizes if the page is hosted on localhost or a remote server.

According to Firebug, rendered font in localhost version is 14.3px while the remote server version is 13px. The size specified via CSS is 13px. Chrome shows both pages with the same size so it's not a server issue.

Is there any configuration variable that could increase font size based on host? Or anything else that might cause this?

  • Can you make sure Firefox are using the Standard render mode in both cases? (Tools -> Page Info) You local server and remote server may have sent the pages with different headers (especially the Content-type header), which made Firefox to render them differently. – billc.cn Jul 26 '11 at 19:45
  • Both page info are exactly the same: standard render mode, same content type and encoding. – Matteo Riva Jul 26 '11 at 20:11
  • First, try clearing your cache and the compare the pages again just in case Firefox is using an old version for one of them. If that doesn't work, I suggest you try disabling all your add-ons apart from Firebug to see if one of them is interfering. On the subject of Firebug, have you definitely checked there isn't a selector somewhere that is setting this value? On the Style tab, click the down arrow and make sure 'Show User Agent CSS' is enabled. – James P Jul 26 '11 at 20:36
  • Started firefox with -safe-mode, same behavior. There is no weird selector even with "Show User Agent CSS" enabled: the only one visibile is the font-size: 13px in the CSS file. The rendered font is instead 14.3px (which is btw exactly 10% more) – Matteo Riva Jul 26 '11 at 20:44

When I Googled this I found someone else who had the same problem. They suggested that it is down to the zoom setting in Firefox: it appears that it can be set independently for internet and intranet pages. Try View -> Zoom -> Reset when viewing each page (you may need to press ALT first to show the menu bar.

Source: http://www.dreamincode.net/forums/topic/98448-font-size-difference-on-localhost-vs-actual-server/

  • That was it. I never thought zoom might be linked to the host. Actually I never thought zoom was saved when a page was closed. – Matteo Riva Jul 26 '11 at 22:00

Is it possible that the hostname isn't resolving from inside the network? Look at resources that can't be loaded in Firebug, you might find that your CSS isn't able to be loaded.

  • The style sheet is correctly loaded and does indeed assign 13px as the font-size. It's just that it gets increased by 10% when rendered, for reasons uknown to me – Matteo Riva Jul 26 '11 at 19:44
  • This was part of the issue for my team. – Joshua Drake Jan 20 '12 at 21:19

I had exactly the same problem - even to the point that some pages behaved and others didn't! Clearing the cache solved it.

I run a bit of JavaScript that grabs the screen resolution from the browser and then sets the font size accordingly. This allows text to remain legible with mega-resolution screens without it being ridiculously large on low-res screens. Maybe I'm missing an easier way to do it, but redefining font sizes in em rather than points or pixels didn't work.

  • Could you share that JavaScript? That might be helpful. – Glorfindel Jul 23 '17 at 15:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.