For some weird reason, my site will not scroll on Galaxy S5 but works fine on iPhones.
Any ideas?
Here’s the read-only link to my website: https://preview.webflow.com/preview/16peaks?preview=4fee5a71d99c5c7d9376fb8bcac12a1b
Did you try changing the body overflow to visible instead of scroll?
@jdesign I tried that but it still doesn’t work. Thanks for the tip anyhow.
This custom code may be the culprit:
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
However, I have this same code inserted into another site and it works just fine on Android. I’m really confused.
The reason I have this custom code is because I absolutely hate my site zooming in when people click on form fields. If this code is the cause of the problem, hopefully there is a way to keep the custom code.
Hey @GodlessGlen and @jdesign you don’t need that custom code to stop zooming in on focus for the form input fields. Instead set you font size in the form input fields to Size 16px. This is the default font setting on mobile devices. When you do this, your phone won’t zoom in on form when in the focus state. 
Let me know if you have any questions or run into any issues. I’ve tested and it works on all devices I’ve checked. (iPhone 6, 6 Plus, GS5, GS4, HTC phones, and iPads).
Waldo
Haven’t taken a look at the site yet. But you should never have to set an overflow setting on the body of your website. Always put a parent container with overflow of hidden or scroll if you need to hide elements off screen/have overflow. I recommend that you never put that setting on the body of the site or you’ll run into additional issues.
2 Likes
Hi @GodlessGlen,
I took a look at the site, and on Tablet Portrait and lower, the body is set to overflow hidden.
Could you check that and set it to visible, and then check again?
3 Likes
@cyberdave Thanks Dave. That fixed it. Yeah, I didn’t think to look at the tablet preview mode. But I’m still puzzled why it worked fine on my iPhone. Guess it’s a glitch on Android.
@Waldo The reason I previously had changed the overflow setting is because I was getting really irked with horizontal scrolling. It was way too easy to accidentally pinch and zoom as well, leaving my site looking strange.
Later I found some custom code and it took care of that horizontal scrolling AND the zooming in on form fields, but I forgot to change the overflow back.
Now you’re telling me that I don’t even need that custom code. Wow, I learn something new every day. I’ll definitely try out your suggestion. BTW, does it matter what font I use? You mentioned putting it a 16px so I’m wondering if the font matters too.
I really appreciate your input.
Yep, never mess with the body overflow. I use use a “section” and set the overflow to hidden, it’s especially important if you are using interactions that push/pull content off to the sides of your page (otherwise, it may look fine on desktop but have issues on mobile).
1 Like
@jdesign I wonder how setting overflow to hidden on a section will work on different mobile devices regarding interactions. I’ll definitely have to try that. Wait… I tried that on a column and it didn’t work like I wanted.
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.