Overflow-scroll="true" is working in browser but not working in android device


#1
<ion-content overflow-scroll="true">
      
   <div >
            <ion-content style="margin-top: 5em;" >
                <div style="background-color: red;text-align: center;color:yellow;height: 100px">
                    <p>ITEMS</p>

                    <ion-content   direction="x"  style="margin-top: 2em;text-align: center;" >

                        <div style="width: 2100px;">
                            <ul ng-repeat="thumb in treename" style="list-style:none ;background-color: red" >
                                <li style="margin-left: 10px;margin-right: 10px">
                                    <p style="width: 100px;height:20px; float: left;margin-left: 10px;color: white;margin-top: 1em;">{{thumb.name}}</p>

                                </li>
                            </ul>
                        </div>


                    </ion-content>

                </div>
            </ion-content>
             <ion-content style="margin-top: 13em;" >
                <div style="  text-align: center;color: #000;height:200px">
                    <p>Beds</p>
                    <ion-content  overflow-scroll="false" direction="x" >
                        <div class="card" style="width:2080px;background-color:rgba(128, 128, 128, 0.22);margin-top: 2em;" >
                            <ul ng-repeat="thumb in bed" ">
                                <li style="margin-left: 10px;margin-right: 10px">

                                    <img style="width: 200px;height: 150px; float: left;margin-left: 5px;border-radius: 10px;" ng-src="{{thumb.image}}">

                                    </li>
                                </ul>
                            </div>
                        </ion-content>
                    </div>
                </ion-content>

                <ion-content style="margin-top: 28em;" >
                    <div style="  text-align: center;color: #000;height:200px">
                        <p>Chairs</p>

                        <ion-content  direction="x" >
                            <div class="card" style="width: 1670px; background-color:rgba(128, 128, 128, 0.22);margin-top: 2em;" >
                                <ul ng-repeat="thumb in dining" ">
                                    <li style="margin-left: 10px;margin-right: 10px">

                                        <img style="width: 200px;height: 150px; float: left;margin-left: 5px;border-radius: 10px;" ng-src="{{thumb.image}}">

                                        </li>
                                    </ul>
                                </div>
                            </ion-content>
                        </div>

                    </ion-content>

                    <ion-content style="margin-top: 42em;"  scroll="true">
                        <div style="  text-align: center;color: #000;height:600px">
                            <p>TV Units</p>

                            <ion-content  direction="x">
                                <div class="card" style="width: 1670px; background-color:rgba(128, 128, 128, 0.22);margin-top: 2em;" >
                                    <ul ng-repeat="thumb in tv" ">
                                        <li style="margin-left: 10px;margin-right: 10px">

                                            <img style="width: 200px;height: 150px; float: left;margin-left: 5px;border-radius: 10px;" ng-src="{{thumb.image}}">

                                            </li>
                                        </ul>
                                    </div>
                                </ion-content>
                            </div>
                        </ion-content>

                       


</div>
                   

</ion-content>
               
        
</ion-view>