Ionic Pages - changing content


        <button ion-button color="primary" (click)="home()">Home</button>
        <button ion-button color="primary" (click)="second()">Second</button>
<ion-nav #myNav [root]="rootPage"></ion-nav>


import { Component, ViewChild } from '@angular/core';
import { Platform, NavController } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { HomePage } from '../pages/home/home';
import { SecondpagePage } from '../pages/secondpage/secondpage';
  templateUrl: 'app.html'
export class MyApp {
  @ViewChild('myNav') nav: NavController;
  rootPage:any = HomePage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.

  home() {

  second() {


In HomePage and SecondPage I put only Test1 and Test2.
Now I have that situation - the header “covers” the rest. So I don’t see any text because it’s below the header. How can I change that behaviour?
And also I want to use one static immovable header/navbar (because there would be an animation). So content which can be changed is under that header/navbar.