Since their earliest version, mobile browsers have been able to do something desktop browsers cannot and that was scaling the screen. They've had to do this because screen real estate on handhelds is at a premium. Before the iPhone perfected the pinch to zoom, you could use keys on Nokia and Blackberry browsers to zoom into and out of a rendered HTML screen. Most mobile browsers assume that standard HTML documents are meant to have a width of 980 pixels. Fortunately, you can control the width of the rendered screen with a<meta> tag. You can set the viewport scale at the optimum width for whatever screen on which its being viewed. I usually set the viewport at the optimum for the 320 by 480 pixels screen and use JavaScript to change the settings if the screen is larger.
Let's take a look at the settings in the html.tpl.php file:
<meta name="viewport" content="width=760, initial-scale=0.74, minimum-scale=0.4">
We can use JavaScript to adjust this setting...