CODEWITHSUNDEEP
cssiphone
ceving
ceving

Reputation: 23794

How to scale a web page on an iPhone?

I have a simple web page showing just a table with some input fields. On a normal browser it is shown in a pretty readable size, because it uses just the browser defaults. But on the iPhone it is rendered extremely small.

enter image description here

I have no idea why the Safari uses just 20% of the screen and it is quite annoying to zoom the page for every use, because even zooming is painful, because it is hard to hit the headline with a double tap, because it is so small.

Is it possible to use some iOS specific CSS to fix this rendering bug? Or is it possible to tell Safari somehow to start this page in zoomed state?

Upvotes: 1

Views: 1699

Answers (1)

Steffi A.
Steffi A.

Reputation: 825

You need to add a meta tag to your html document head to use the device width on mobile devices:

<head>
  <title>...</tile>
  ....
  <meta content="width=device-width, initial-scale=1, minimum-scale=1, user-scalable=no" name="viewport">
</head>

Upvotes: 4

Related Questions