This is doubtlessly too late, but I sure would have appreciated an answer to this thread last week, so here’s what I figured out.

I was never able to get it working with 100% width in its containing element, but things went pretty easy once I switched to vw units (a unit that is 1% the size of the viewport). If you’re aiming to do the full width of the viewport anyway, 100vw is a fine alternative to 100%.

In my specific case, I actually wanted a horizontal scrollable to be placed next to a fixed-width column. Since using 100% kept giving me trouble, I put a calc() in to subtract out the column’s width from the total viewport: calc(100vw - 470px).

.chat-holder{
    padding: 20px 10px;
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

use overflow-x:hidden; this is more good

HTML CODE:

Hello
200X200

HTML CODE:
”’

Hello
200X200

”’

CSS CODE:
”’#a
{
width: 200px;
height: 200px;
overflow: hidden;
background-color: #cc4400;
}
#b
{
position: absolute;
height: 100px;
width: 200px;
padding: 0;
margin: 0;
transform: translatey(200px);
background-color: #404040;
transition-property: all;
transition-duration: 1s;
}
#c
{
position: absolute;
width: inherit;
height: inherit;
margin: 0;
}
#a:hover > #b
{
transform: translatey(100px);
background-color: 606060;
}”’

https://jsfiddle.net/irshadmb/a3z5ccax/

Does anybody know of a current Android ‘overflow: scroll’ or ‘overflow: auto’ problem? Or does anyone have the same issues.

Can’t provide the dev code, but I think all the relevant css is there:

.box { 
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    height: 35em;
}

Any help would be great!

Was there a response to this question? I have the same requirement. Thanks, Bill. The question was “..is possible when the container element does not have a fixed width? In other words, where the wrapper is not explicitly set but is instead defined by the page wrapper or body? (In other words, ‘100%’)”