Home/ Questions/Q 8454043
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T11:55:23+00:00

I examined the window object in Firebug. window.innerWidth and window.outerWidth are both 1230 .

  • 0

I examined the window object in Firebug. window.innerWidth and window.outerWidth are both 1230.

What is the difference between these two values?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    From Mozilla Developer Network:

    window.outerWidth

    window.outerWidth gets 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.

    and

    window.innerWidth

    Width (in pixels) of the browser window viewport including, if
    rendered, the vertical scrollbar.

    This is ostensibly how they work. A test page, however, shows they are both the same no matter how I resize them in Firefox 14.0.1 on Ubuntu 12.04. In Chromium, they return numbers that are 8 pixels different. Doing a bit of dead reckoning, it appears the window chrome on that particular app is about 4 pixels on the left side and 4 pixels on the right side and that this difference is being correctly picked up in that browser.

    Code for the test page I used:

    <!DOCTYPE html>
<html lang="en">
<head>
    <title>12066093</title>
    <meta charset="utf-8">
</head>
<body>
<div style="width:2000px; height: 2000px;">hi</div>
<script type="text/javascript">
    alert("window.innerWidth: " + window.innerWidth + "\nwindow.outerWidth: " + window.outerWidth);
</script>
</body>
</html>
    • 0