Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

iPad - iPad/iPhone - overflow-y:scroll; - vertical scroll not displayed, cuts off

Posted on 2010-09-15
4
Medium Priority
?
3,505 Views
Last Modified: 2012-05-10
http://ikonltd.com/artists/index.cfm

I made the overflow-y:scroll adjustment to my style to accomodate some sort of mobile device -blackberry i think.  When this page is viewed in a non-mobile device browser, a vertical scroll is displayed. When it's viewed in an iPad (and I think iPhone as well), There is no scroll and the list of artists gets cut off midway down.


#twoColumnSideNav ul.col1 {

text-align:left;

float:left;

width:200px;

height:450px;

overflow-y:scroll;

margin:0;

padding:0;

}

Open in new window

0
Comment
Question by:phillystyle123
  • 2
  • 2
4 Comments
 
LVL 1

Expert Comment

by:Simon-H
ID: 33684332
Unfortunately, this is functioning as expected.

This can be proven by using two fingers to scroll down the list of artist.

I know it's not ideal but it is expected behaviour.

Just to clarify, did you say it was working properly before you added "overflow-y:scroll;" to your script?

Regards,
0
 

Author Comment

by:phillystyle123
ID: 33684737
Thanks for looking at this. It wasn't working properly before -  even in blackberry. overflow-y:scroll; fixed the blackberry dilema but iPhone/iPad stayed the same (the way it is currently).
0
 
LVL 1

Accepted Solution

by:
Simon-H earned 2000 total points
ID: 33685153
try this js script;

http://cubiq.org/scrolling-div-on-iphone-ipod-touch

let me know how you get on with that, hopefully does the job :)
0
 

Author Closing Comment

by:phillystyle123
ID: 33685526
Thanks!
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
Originally, this post was published on Monitis Blog, you can check it here . It goes without saying that technology has transformed society and the very nature of how we live, work, and communicate in ways that would’ve been incomprehensible 5 ye…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question