I have the strangest issue with Firefox on Android. When focusing an input it zooms the page and scrolls to the input. When leaving focus the site is locked in that zoomed in state until I navigate to another page. The page is still zoomed but I can zoom in and out normally again.
Strangely it only does it on one route where there's only one input, so I tested adding more elements but the issue remains.
Even stranger, on another phone with the same version and build of Firefox (94.1.2) I can't reproduce it. I'm on Android 11 and the phone where it couldn't be reproduced is Android 9.
I've tried these fixes without success.
Meta viewport tag:
<meta name="viewport" content="width=...,height=...,initial-scale=1.0,user-scalable=no"/>
This answer suggesting this hack:
input:focus { font-size: 16px !important; }
Finally I disabled all my extensions, cleaned up the markup to the bare minimum, and even added more inputs and other content (to match the working routes) and so far nothing helps.
There's nothing special about the input but here's the relevant code:
<input type="text" placeholder="placeholder" />
.input {
width: 100%;
padding: .25rem .5rem;
border: 1px solid #ddd;
}
Now I'm running out of ideas so I'm hoping any of you have come across the same issue.
