Develop Reference

Disable pinch to zoom is not working using iPhone onto my React Application

into my application I've disabled pinch to zoom using those lines of code
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="mobile-web-app-capable" content="yes">
all of this is working well everywhere but not on iPhones... someone can help me?

Disable zoomin in iOS (webpages)

I'm trying to disable the zoom in when users clicks on input (iOS). I've tried a lot of things like:
Force font-size to 16px;
Modify viewport user-scalable=no
It seems that anything works in the latest version of iOS.
Could you help me?
Thank you!
EDIT: I would like to allow the user to do zoom if they want. I want to prevent the auto automatic zoom when user clicks on input.

Try viewport in head:
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' />

Add this to your HTML:
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

My site doesn't detect viewport

I have a site called Healthot. It's a responsive site, with the meta viewport tags and the media queries. The problem is that the site only adapts when I resize Chrome's window of my Mac. When i enter the site in a mobile phone, like iPhone 5, it's doesn't scale.
The site is http://www.healthot.com

You have to add a meta tag in the head, which I don't seem to find on your site.
<meta name="viewport" content="initial-scale=1, maximum-scale=1">

Hm... I dont see
<meta name="viewport" content="width=device-width, initial-scale=1.0 " />
in firebug.
Try to add all year meta tags in top of the head. Sometimes it is can be important

From where is this coming?
<script async="" type="text/javascript" src="http://whos.amung.us/pingjs/?k=xd69ovuycv2g&t=Healthot%20%7C%20Fitness%20control.%20Better%20bodies.&c=s&y=http%3A%2F%2Fstackoverflow.com%2Fquestions%2F23115237%2Fmy-site-doesnt-detect-viewport&a=0&r=7773"></script>
And add
<meta name="viewport" content="initial-scale=1, maximum-scale=1">

Web page loading "zoomed"

I'm working on developing a mobile site and for whatever reason the page seems to load as if it is zoomed in every single time. I can scale it easily on a touch phone and it looks just about right, but I was wondering if anyone had any ideas of how to prevent this from happening.
I have tested this issue on Android and iPhone and it seems to be happening on both.
This didn't seem to help all except that I was unable to scale after the page loaded
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1">

You can try to use that :
That block pinch to zoom
<meta name="viewport" content="width=device-width, user-scalable=no" />

I would recommend the following meta, as it sets the page load zoom, rather than blocking the zoom function.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
-Edit-
I didn't actually notice you already had initial-scale=1 in your meta. Try with '1.0' instead, I'm not sure if it will make a difference.

Using a different viewport meta tag for iPad vs everything else?

I'm using this metatag on my site:
<meta name="viewport" content="width=device-width, initial-scale=.5">
That scale makes things work just perfectly on iPhones (which I know is unorthodox... not using 1), but when the user agent is an iPad what I'd like to do is serve this:
<meta name="viewport" content="width=device-width, initial-scale=1">
Just wondering if any of you guys have clever ideas for how I might do so? Thanks so much!