Bottom of the website is being cut off on mobile?

Hi,

The bottom section is not completely visible on the published mobile screen. The user cannot scroll all the way to the bottom of the screen. In the designer, you can see the " Community section is visible " but not on the published site. https://problem-site.webflow.io/


Here is my site Read-Only: https://preview.webflow.com/preview/metacreed-7f750c2cedb4655c46eb838c5e87e?utm_medium=preview_link&utm_source=designer&utm_content=metacreed-7f750c2cedb4655c46eb838c5e87e&preview=df99cf2e742177d472067c74f105e0fb&workflow=preview
([Here is the published link ][ https://problem-site.webflow.io/ ])

hi @Muhammad_Ehtsham it is visible on my side

@Stan

This is what I’m seeing on 5-10 devices.

hi @Muhammad_Ehtsham I have no devices with Android. I have now tested website on iOS devices in Safari, Chrome, Firefox and Brave and the “community” section works as expected on all of them.

Hey @Stan
Thanks for taking the time and looking into it.
I really appreciate it.

It means the problem is only on the android devices,
Is there any particular solution which I should apply?

1 Like

hi @Muhammad_Ehtsham unfortunately I do not know. But try this forum (with advanced filter) to see if anyone had similar problem on Android, and google it as well. At least now you know that rendering issue is related to OS and not mobile browser. Only I can thing I can think right now is that it can be related to VH mean that any section set to eg. 100vh can produce unexpected behaviour. But its just pure guess as I didn’t study your structure and setup in detail.

EDIT: I have now checked youl live page (read only give 404) and I see that you have height: 100vh on problematic section. You can try to set to min-height instead to see if this help.

@Stan Actually, the problem is not with the community section. I thought there might be something wrong with the community section, so I’ve deleted it. then the problem was still there with the section above the community section. The same goes for the rest of the sections.

hi @Muhammad_Ehtsham try min-height as I have mentioned to see what happened. The good way is to hide all sections (add class hidden) and unhide (remove class) one by one to test it. Setting only height: 100vh will cause problems on mobile landscape anyway.

Hey @Stan
I’ve tried adding min-height instead of the fixed height along with hiding each section one by one but was unable to figure it out.

By the way, thanks for your help. I really appreciate it.