Android Stock Browser Not Respecting CSS Overflow

Question

I\'m working with a client who would like part of their interface to have a somewhat customized method of scrolling. They don\'t want the usual scrollbars to be visible; they wa

Answer 1

I believe Android stock browser doesn't support x/y-specific overflow properties. Instead of turning on overflow-y, turn on overflow then turn it off for overflow-x. Example:

ul {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-y: scroll;
}

should become:

ul {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: scroll;
    overflow-x: visible;
}

Generally I use auto instead of scroll so the scroll bars won't show up if not necessary. Also, perhaps overflow-x: hidden; may be more desirable in your situation. Basically this will apply your desired overflow-y property to overflow-x as well, but usually this is more desirable than the rule being ignored completely. For browsers that support the axis-specific overflows the user won't know the difference.

Answer 2

I've had issues with the stock Gingerbread Android browser. It does not handle the overflow CSS property well at all. In order to enable scrolling on this browser I had to apply the overflow ("scroll" or "auto") to the BODY container only.