We're calling on all EU-based Mozillians with iOS or iPadOS devices to help us monitor Apple’s new browser choice screens. Join the effort to hold Big Tech to account!

Cerca nel supporto

Attenzione alle mail truffa. Mozilla non chiederà mai di chiamare o mandare messaggi a un numero di telefono o di inviare dati personali. Segnalare qualsiasi attività sospetta utilizzando l'opzione “Segnala abuso”.

Ulteriori informazioni

Questa discussione è archiviata. Inserire una nuova richiesta se occorre aiuto.

Why do elements display larger than specified?

  • 2 risposte
  • 2 hanno questo problema
  • 4 visualizzazioni
  • Ultima risposta di cor-el

more options

I am developing a website (my first) and I wish it to display much the same on the major browsers. With Firefox, things are 25% larger than I specify. I did a simple test with a div element: < body >< div style="background-color:red; width:300px;" >This is 300px div< /div >< /body >. (Spaces added in this question as otherwise the tags are not displayed.) The size of the div element on my screen is 375px (as determined by pasting an image of the screen into Paint).

My Firefox setting is 100%. I have a 1680x1050 screen and I wondered whether Firefox was making an adjustment based on my screen resolution. I changed the resolution to 1440x900, 1360x768, 1280x1024, 1280x800 and even 800x600 and got the same result.

I could adjust the zoom setting to compensate on my screen, however that is not a solution because I clearly can't do that to visitors to my website.

What is causing Firefox to display larger than I expect and how do I compensate?

PS. When the browser window is maximized and the screen resolution is 1680X1050, document.body.clientWidth and document.body.offsetWidth are both 1311 - giving a ratio of roughly 1.25. Why are clientWidth and offsetWidth not roughly equal to the width of the screen.

I am developing a website (my first) and I wish it to display much the same on the major browsers. With Firefox, things are 25% larger than I specify. I did a simple test with a div element: < body >< div style="background-color:red; width:300px;" >This is 300px div< /div >< /body >. (Spaces added in this question as otherwise the tags are not displayed.) The size of the div element on my screen is 375px (as determined by pasting an image of the screen into Paint). My Firefox setting is 100%. I have a 1680x1050 screen and I wondered whether Firefox was making an adjustment based on my screen resolution. I changed the resolution to 1440x900, 1360x768, 1280x1024, 1280x800 and even 800x600 and got the same result. I could adjust the zoom setting to compensate on my screen, however that is not a solution because I clearly can't do that to visitors to my website. What is causing Firefox to display larger than I expect and how do I compensate? PS. When the browser window is maximized and the screen resolution is 1680X1050, document.body.clientWidth and document.body.offsetWidth are both 1311 - giving a ratio of roughly 1.25. Why are clientWidth and offsetWidth not roughly equal to the width of the screen.

Modificato da robertscolaro il

Soluzione scelta

You can set the layout.css.devPixelsPerPx pref to 1.0 to disable the 1.25 increase caused by the Windows DPI setting (default is -1).

Otherwise you need to set the Windows DPI setting to 96..

Leggere questa risposta nel contesto 👍 1

Tutte le risposte (2)

more options

These support forums are for issues with browsing the web using Firefox. For development related questions I advise using the Mozilla Developer Network.

That said, I would bet Windows' DPI settings are to blame here.

Modificato da Mark Schmidt il

more options

Soluzione scelta

You can set the layout.css.devPixelsPerPx pref to 1.0 to disable the 1.25 increase caused by the Windows DPI setting (default is -1).

Otherwise you need to set the Windows DPI setting to 96..