Tab content overlapping behind tab buttons

<ion-view class="app-settings">
	<ion-header-bar align-title="right" class="appPageHeader">
		<button class="button button-icon icon ion-navicon" ng-click="toggleLeftMenu();"></button>
		
		<h1 class="title">Settings</h1>
	</ion-header-bar>
	
	<ion-tabs class="tabs-assertive">
		<ion-tab icon-on="ion-person" icon-off="ion-person">
			<ion-content>
				<div class="list list-inset">
					<label class="item item-input">
						<input type="text" placeholder="First Name">
					</label>
					
					<label class="item item-input">
						<input type="text" placeholder="Last Name">
					</label>
				</div>
			</ion-content>
		</ion-tab>

This is the code I am implementing in my App.But as you can seen in below screen shot, .pane class is overriding the .has-header and .has-tabs-top styles and that’s why my tab-content is overlapping behind tab buttons. Is this a bug or I am doing something wrong.