CODEWITHSUNDEEP
javascript
Maik Lowrey
Maik Lowrey

Reputation: 17594

Why does outerWidth give different values for some websites?

I wonder why window.outerWidth gives me a bigger value at Stackoverflow.com than at other websites in my browser. I have just noticed this behaviour only on Firefox and Stackoverflow. Shouldn't it be the same on all websites?

In MDN Web Docs it says:

Window.outerWidth read-only property returns the width of the outside of the browser window. It represents the width of the whole browser window including sidebar (if expanded), window chrome and window resizing borders/handles.

Example outerWidth at fullscreen:

So far I haven't found any website that has a similar behaviour.

console.log( window.outerWidth )

steps to to reproduce it

  1. visit stackoverflow.com
  2. open Developertools / Console
  3. write window.outerWitdh
  4. visit google.com or other side
  5. write window.outerWitdh in the console

In Firefox 95 on Ubuntu 18.04 lts these two values are different. Stackoverflow has a larger value.

Upvotes: 1

Views: 62

Answers (1)

Dai
Dai

Reputation: 155708

  • You are running StackOverflow.com at 90% zoom.

    • Assuming that 2070px is your browser windows' actual width on your desktop, then if you multiply that by 0.9 (90%) then you get 1863px (2070 * 0.9 == 1863).

  • When you run Firefox at different zoom level, Firefox multiplies all other measurements of the page's environment (including the browser and viewport) so the page doesn't actually know it's being zoomed.

  • Reset your zoom level in all your Firefox tabs to 100% and then numbers will match.

Upvotes: 4

Related Questions