page is not scrolling vertically in mobile devices

5
votes

I'm working on a project. There is an issue on the front end side. The site is responsive, but when I view it in mobile width (specially for iPhone 4 & 5), the vertical scroll doesn't work.

I'm not using any div that needs scrolling, the whole page is not scrolling vertically, I'm afraid I can't provide the code. The thing I wanna know is why does this happens? and what would I've possibly done wrong?

1) I have added -webkit-overflow-scrolling:touch on body tag but my chrome browser is not picking it up and saying invalid property.

2) I have added body{overflow-y:scroll,position:relative} Now its showing a scroll but there is no bar between the scroll, and its pretty much stuck there.

1
htmlcssscrollvertical-scrolling
Do you maybe have overflow: hidden; on body or html? – Nenad Vracar
no there is no overflow hidden. – Coder
Maybe its some plugin. Can you post link to your website? I remember i had same issue once. – Nenad Vracar
@NenadVracar, im sorry i checked it again and there was actually an overflow:hidden at max-width:320px media query, i commented it, but the scroll is still not working – Coder

1 Answers

8
votes

I think its because of position and z-index the z-index value make problem in your small screen.

Its possible that the element which have high z-index value. stopping you for scroll.

and It can be possible you have overflow:hidden in wrong place. It will be good, If you show some code of line or your site link.