Ionic Ion-Button icon-only

Question

I'm very new in Ionic2 or Ionic at all. I set up a new project and want to design a small menu at the bottom of the foot of my page. I didn't do anything else on this project and trying to imitate the steps of a tutorial video. but when I use the icon-only directive on a button the background of the button only becomes a bit smaller. The background doesn't disappear.

<ion-content class="bg-image" padding>
</ion-content>
<ion-footer>
  <ion-toolbar>
    <button ion-button icon-only>
      <ion-icon name="home"></ion-icon>
    </button>
    <button ion-button icon-only>
      <ion-icon name="add"></ion-icon>
    </button>
  </ion-toolbar>
</ion-footer>

Here's my code. I hope you can help me.

Answer 1

For Ionic 4 - <ion-button fill="clear">

You can use the fill property now, e.g:

<ion-button (click)="onClick()" fill="clear">
      <ion-icon slot="icon-only" name="home"></ion-icon>
</ion-button>