I am developing a web app, and it works great in the browser and when saving it to home screen, on both android and ios. However, when downloading it as an actual app the % height on .container doesn’t work on android. If i make i try making it as a static height in pixels… it does. Anyone know what might be the reason for this? Can it be something with the “shell” (which isnt made by me) that my html/css etc is used within when using it as an app? It’s the first time I make a web app, anyone experienced this before?
I don’t have any experience with apps but if your code is nested inside another element that has no height set then you will lose the 100% effect because it will collapse to auto. Can you re-code without relying on height?
might be, but .container also doesn’t get 100% height if I set it as absolute positioned, or maybe it is, but it is <body> that isn’t getting height 100%? absolute positioned and 100% height works on children to .container so it should work on that one aswell.
It’s probably not supported in those devices and in early versions of -webkit you still needed 100% height on html,body to make it work.
Maybe you need to re-think how the page is displayed so that it doesn’t rely on height as such.
As Ryan suggested perhaps you need to go back to the beginning and just find out what is happening with some basic cut-down html and then take it from there. Height:100% has always been an issue when referring to the root element. Mobile viewports are not like real viewports which is why fixed positioning took a long long time to work on some devices.