Reputation: 5869
I have a mobile version of a webpage. All it has is a single form w/ two text boxes and one submit button.
But on the mobile browser, the form is tiny until you zoom in on it. How do you make a form look normal by default on a mobile browser?
Upvotes: 3
Views: 1966
Reputation: 10351
With the meta viewport, I use the following:
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
This way, there is no restriction on the width, so it can adjust accordingly whether the user is using a mobile phone or an iPad (or other tablet device). I would only recommend using the user-scale=no
if you are building a site specifically for mobile.
Upvotes: 6
Reputation: 5672
Is your Doctype mobile? Try using
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
so that phone's browser would know that page is designed for mobile phones
Upvotes: 1
Reputation: 32258
You will need to add the viewport meta tag to the HTML header. This will tell the browser that your page is suppose to be rendered into a certain aspect. e.g.
<meta name="viewport" content="width=240,user-scalable=no" />
Upvotes: 1