page is not scrolling vertically in mobile devices

html css scroll vertical-scrolling
Coder picture Coder · Jan 22, 2016 · Viewed 26.1k times · Source

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.

Answer

Mukul Kant picture Mukul Kant · Jan 22, 2016

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.

Related questions

Disable Scrolling on Body

I would like to disable scrolling on the HTML body completely. I have tried the following options: overflow: hidden; (not working, did not disable scrolling, it just hid the scrollbar) position: fixed; (this worked, but it scrolled completely to the …

Read More
How to display scroll bar onto a html table

I am writing a page where I need an html table to maintain a set size. I need the headers at the top of the table to stay there at all times but I also need the body of the …

Read More
Disable vertical scroll bar on div overflow: auto

Is it possible to allow only a horizontal scroll bar when using overflow:auto (or scroll)?

Read More