Create List side by side with own scroll behaviour for Tablets

I want to create 2 list in screen side by side for tablet and normal single list when using mobile. I already tried using this code :

HTML :

<ion-content>
<ul class="list card" style={{width}}>
 </ul>
<div class="list card" ng-if="dev_width >= 750">
</div>
</ion-content>

JS :

$scope.dev_width = $window.innerWidth;
if($scope.dev_width >= 750)
{
	$scope.width = "width: 40%;float:left;margin: 0px;margin-right :10px;margin-left:10px;"; 
}

But, using this code scroll working for whole . I already tried using two <ion-scroll> for both list but scroll does not work for individual list.

I want to know better way to show split view for tablet and normal view for mobile. Please help me to resolve this.

Thanks.