<ion-content> is hiding behind <ion-header>

Ionic Framework ionic-v3
1

My ionic version is 3.19.1, and checked the scenario in android device and in browser but the result is same. Please see the image i have attached with this issue. .

localhost_8100_(Nexus%206)
localhost_8100_(Nexus 6).png1442×2562 319 KB
localhost_8100_(Nexus%206)%20(1)
localhost_8100_(Nexus 6) (1).png1884×2560 366 KB 

<ion-header>

  <ion-navbar>
    <ion-title>Physics</ion-title>
  </ion-navbar>

</ion-header>

<ion-content padding>
		<ion-list class="chapter-list">
			<button ion-item no-padding *ngFor="let chapterList of chapterLists" (click)="chapterListItemClk(event)" no-border>
				{{ chapterList.video_name }}
				<img src="{{chapterList.video_icon}}" item-left alt="">
			</button>  
		</ion-list>
</ion-content>