Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Block websites from detecting window size

It seems that many websites are able to detect the size of the browser window. This creates two major problems for me:

1. If I resize the window smaller than some unknown threshold width, the site switches to a mobile version. 2. If I resize the window beyond a certain dimension, video sites like Youtube will shrink the size of the video player to some proportionally smaller size.

I have a 42-inch monitor, so I like to work with multiple windows open at the same time, in non-overlapping positions. I might want to watch a video in a window perfectly resized to the dimensions of the video player plug-in only, in the corner of my screen, while working on a Word document side-by-side with a webpage and an Excel spreadsheet. I like to resize things in tall, narrow dimensions because this is what documents look like in real life and it minimizes vertical scrolling.

How can I either block websites from detecting my browser window dimensions or pass a phony value to them so they display the full-size page (including larger sizes of media players) no matter what size I actually make the windows? I'd prefer to do this in the about:config rather than installing an add-on.

Why do web designers put so much effort into avoiding scrollbars?!?! Is it so that we have to look at their stupid ads and banners along the margins of the real content?

It seems that many websites are able to detect the size of the browser window. This creates two major problems for me: 1. If I resize the window smaller than some unknown threshold width, the site switches to a mobile version. 2. If I resize the window beyond a certain dimension, video sites like Youtube will shrink the size of the video player to some proportionally smaller size. I have a 42-inch monitor, so I like to work with multiple windows open at the same time, in non-overlapping positions. I might want to watch a video in a window perfectly resized to the dimensions of the video player plug-in only, in the corner of my screen, while working on a Word document side-by-side with a webpage and an Excel spreadsheet. I like to resize things in tall, narrow dimensions because this is what documents look like in real life and it minimizes vertical scrolling. How can I either block websites from detecting my browser window dimensions or pass a phony value to them so they display the full-size page (including larger sizes of media players) no matter what size I actually make the windows? I'd prefer to do this in the about:config rather than installing an add-on. Why do web designers put so much effort into avoiding scrollbars?!?! Is it so that we have to look at their stupid ads and banners along the margins of the real content?

All Replies (6)

Not exactly, but there is an add on that let's you set some default windows sizes:

Web sites actually are told an adjusted value for the window size. This adjustment is based on your Windows "text size" (DPI setting) and any additional zoom you apply yourself. You can see roughly how that affects the size reported to websites on this test page:

http://dev.jeffersonscher.com/resolution.html

I don't know of a way to override that and report a higher value without actually changing the zoom level of the page to make the text smaller. Hmm...

guigs2 said

Not exactly, but there is an add on that let's you set some default windows sizes:

I'm not sure what this add-on is supposed to do. It seems that it only sets the default size of a new browser window. If so, that doesn't serve any purpose for me because I am always reshaping my application windows depending on what I am doing at the moment.

jscher2000 said

I don't know of a way to override that and report a higher value without actually changing the zoom level of the page to make the text smaller. Hmm...

And that's precisely what I want to do. How many different ways can a website query the user's screen size? (JS, CSS, etc.) If the list of methods is short enough, is there a way that I could block those specific methods, or better yet force a return value of my choosing? I don't know anything about user stylesheets, but based on some casual research I suspect that I can stop CSS-based queries by creating my own user stylesheet.

I suppose an extreme measure is to block those scripts entirely, but that would break a lot of websites these days.

The resolution page demonstrates two methods:

(1) CSS media queries (style rules applied to different resolution ranges) (2) window.devicePixelRatio, a value that can be extracted by a script

There might be ways to return different values but I haven't researched them.