Web browser - how to pass true native resolution to prevent sites from serving up mobile responsive design

How can Chrome (or some other browser) be configured to tell websites its resolution is the native resolution of the phone and not a reduced resolution that's adjusted for being high DPI? "Request desktop site" works for some sites, but not all, and ones that detect the resolution of the phone will show the mobile "responsive" layout. For example, if I Google "what is my screen resolution" and visit the first site, it reports 360x640 even though my phone is 1440x2560. I'm running Lollipop if that matters.

Answer

It turns out you can use Firefox for Android to do this:

1. In the address bar go to about:config and then search for pixels.


2. Select layout.css.devPixelsPerPx and change the value from -1.0 (default) to 1 if you want sites to think the resolution of your browser is the true native resolution of the screen rather than a DPI-adjusted value.


3. If you have a super high resolution screen like a QHD (1440x2560), you may want to set this to 2 rather than 1, and then if you use the phone in landscape mode, your resolution will be 1280x720 which won't make things as small by default as setting it to 1 would.

Using the above in conjunction with "Request desktop site" should do a great job at always showing the desktop site for not only user-agent-detection-based sites but also for responsive media-query-based sites.