When we are designing a web app in ionic we are using like
<ion-header-bar align-title="center" class="bar-positive">
<h1 class="title ">Dashboard</h1>
</ion-header-bar>
<ion-nav-view name="viewContent"></ion-nav-view>
</ion-content>
<ion-tabs class="tabs-icon-top tabs-custom">
<!-- Dashboard Tab -->
<ion-tab title="Home" icon-off="mcfly" icon-on="mcfly" href="#/dashboard">
</ion-tab>
<!-- Chats Tab -->
<ion-tab title="profile" icon-off="mcfly1" icon-on="ion-ios-pulse" href="#/camera">
</ion-tab>
<!-- Account Tab -->
<ion-tab title="orderdetails" icon-off="mcfly2" icon-on="ion-ios-pulse" ng-click="camera">
</ion-tab>
<ion-tab title="appointment" icon-off="mcfly3" icon-on="ion-ios-pulse" ng-click="camera" >
</ion-tab>
<ion-tab title="add member" icon-off="mcfly4" icon-on="ion-ios-pulse">
</ion-tab>
</ion-tabs>
But when we run this in iphone its produces unwanted spacing on top and bottom of the list scrolls under the tab view. Please check the image below
