CODEWITHSUNDEEP
androidhtml
kia4567
kia4567

Reputation: 603

Website zooming on Android

My website looks great on iPhone but zoomed in on Android. I've got the standard device width code in the header (and I've used this for all websites I've done and they look fine) but for some reason this isn't working on Android and the website seems to be majorly zoomed in. 

<meta name="viewport" content="width=device-width" />

I want it to look like the way it does on iPhone. So when it loads you can see the whole width.

enter image description here

Like this here.

Yet on the android it does this...

enter image description here

Anyone have advice as to why it's zoomed in on Android and how I can fix this weird tweak.

Upvotes: 1

Views: 178

Answers (2)

Chuck Le Butt
Chuck Le Butt

Reputation: 48758

Try setting the width to the actual width of your site, rather than the device with.

For example:

<meta name="viewport" content="width=980">

Also, I'd suggest getting a good book on HTML/CSS and working your way through.

Edit: O'Reilly's 'Head First' HTML & CSS is extremely easy to follow, but will also give you a solid foundation.

Upvotes: 2

Jorge Cevallos
Jorge Cevallos

Reputation: 3678

Try this:

<meta name="MobileOptimized" content="320">

besides your

<meta name="viewport" content="width=device-width">

(or change 320 to whatever makes sense)

Here's a working example, you can check its source code:

http://m.qrdroid.com

Upvotes: 1

Related Questions