I am facing a different issue as when I use bootstrap css.Here is my code:
<ul id="insideScroller" class="scrollable-menu scrollbar list-group" style="-webkit-overflow-scrolling: touch;" >
<aura:iteration var="sobj" items="{!v.SobjectRecords}">
<!-- Navigation to record detail page works only SF1-->
<li class="list-group-item" id="{!sobj.SId}" onclick="{!c.navigateToRecord}" >
<aura:renderIf isTrue="{!0 lt v.fieldsToDisplayCount}">
{!v.lstFldDisp[0]} : {!sobj.f1}<br/>
</aura:renderIf>
<aura:renderIf isTrue="{!1 lt v.fieldsToDisplayCount}">
{!v.lstFldDisp[1]} : {!sobj.f2}<br/>
</aura:renderIf>
<aura:renderIf isTrue="{!2 lt v.fieldsToDisplayCount}">
{!v.lstFldDisp[2]} : {!sobj.f3}<br/>
</aura:renderIf>
</li>
</aura:iteration>
</ul>
I am able to see the scrollbar in SF1 and the desktop.But when I load the same page in mobile the scrollbar disappears.
Any workarounds over this?