100vh height when address bar is shown - Chrome Mobile
As per this official article on Chrome web, the proper way to set the height to fill the visible viewport is with height: 100%, either on the <html> element or on a position: fixed element. As the document describes, this ensures compatibility with mobile Safari and is independent of how large the URL bar is.
Try using min-height: -webkit-fill-available. You can also add it below height: 100vh as a fallback.
you can fix the address bar issue with setting height: 100% on html and body tagand off course set margin and padding of body to zeroand also you can handle scrolling in your main div for better controll