Hello I was wondering if there was a workaround, or equivalent, for safari's viewport-fit=cover to extend a site past the iPhone notch, but for Chrome.
<meta name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1.0, width=device-width" viewport-fit=cover/>
Everything I have read, and tried, seems to confirm including viewport-fit=cover does not work on Chrome iOS.
Here is a resource page I found: https://webkit.org/blog/7929/designing-websites-for-iphone-x/
I am making a web page which includes a single canvas for three.js rendering of a 3D Model and would like the whole scene to cover the page.
UPDATE - I came up with a workaround that one might be able to use.
In simple terms, my approach to extending the web page past the iPhone notch is to zoom on the page, and scroll to the middle.
you can see my full solution at https://github.com/anthonypena97/chromeios-viewportfitcover
I wrote it within a three.js environment, but you can draw your solution from some studying of my code