100vh on facebook browser
I am trying to do 100vh hero and it works fine on chrome, but because of bottom navigation it resizes background image every time bottom navigation pops out/in
4 Replies
Are you using any window resize eventListener on the hero section?
A codepen would be great
There is a solution for this: "dynamic viewport units". It has just launched a couple of weeks ago in a couple of browsers (not all yet, and users have to update their browers). I don't know what facebook uses, but try and use 100dvh or 100dvmax
To make sure there is a fallback first set the height in vh
more about this:
Kevin: https://www.youtube.com/watch?v=5m6JOJLy5B0
Browser support: https://caniuse.com/viewport-unit-variants
It is just a simple container with background image that is centered and fixed. It works fine on chrome. But using Facebook browser It keeps resizing It.
I can make codepen for you. Or Give you netlify/github link.
Here. Video for you
Okay. Most browsers work now. Problem was with not supporting scale CSS. But Facebook browser doesnt support even transform