Home/ Questions/Q 3350714
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T01:49:13+00:00

I have used the following code in my site to prevent the Android browser

  • 0

I have used the following code in my site to prevent the Android browser from rendering it wider than the screen resolution. It’s code that I found on this site but while preparing to ask this question I was unable to find the original question again for reference. 

<meta name="HandheldFriendly" content="true" />
<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no" />

To start with, this code worked. The browser was originally rendering the page to be about three time as wide as the screen resolution, and Opera Mini did the same. After inserting these two lines into my <head>, the problem went away and the page was rendered as it should be. I remember from the answer that provided this code that this abnormal width was caused by the WebKit rendering engine that powered, among others, the Android and iOS browsers.

Question: Does anyone know why WebKit overrides the screen resolution and renders the page at a resolution greater than can be accommodated on the screen?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It has to do with the phone’s default viewport settings. This is not, per se, WebKit’s doing, but rather the implementation of the browser on the device. Here are some default layout widths: Safari iPhone uses 980px, Opera 850px, Android WebKit 800px, and IE 974px.

    You could check into these for more info: http://www.quirksmode.org/mobile/viewports.html & http://www.quirksmode.org/mobile/viewports2.html

    • 0