One common issue observed in mobile browsers is that they tend to zoom in on an input field or select drop-down when focused. After exploring various solutions, the most elegant one I came across involves setting the font-size of the input field to 16px. While this solution works well for standalone input fields, it may result in a gap beneath the button if there is a parent container that includes a button.
Alternatively, you could set a default font size for input fields at 16px and adjust the button size accordingly.
It's worth noting that setting the font size to 16px does not prevent select drop-downs from zooming in as well.