The home page of a site I am working on consists of a div that is 100vh and 100vw with content inside it. When testing using Chrome Dev tools the design on different screen sizes from iPhone5s all the way to iPad Pro and a high res desktop work fine. However when the site is viewed on an actual device like an Android phone the page becomes scrollable with some of the content not visible unless a user scrolls. I think this is due to the Chrome navigation bar.
I want no vertical scrolling.
I have had a look around on SO and tried adding the following code to my header but the result is the same. <meta name="viewport" content="width=device-width, initial-scale=1.0", user-scalable=0>