# Ionic clear button not working properly (ionic 5)

**URL:** <https://forum.ionicframework.com/t/ionic-clear-button-not-working-properly-ionic-5/185140>\
**Category:** Ionic Framework\
**Created:** [March 15, 2020, 2:16am UTC](https://forum.ionicframework.com/t/ionic-clear-button-not-working-properly-ionic-5/185140 "2020-03-15T02:16:27Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![lily28](https://avatars.discourse-cdn.com/v4/letter/l/f9ae1b/32.png) [@lily28](https://forum.ionicframework.com/u/lily28)\
**Post date:** [March 15, 2020, 2:16am UTC](https://forum.ionicframework.com/t/ionic-clear-button-not-working-properly-ionic-5/185140/1 "2020-03-15T02:16:27Z")

</div>

I am trying to make a button transparent, it supposedly looks like this

![image](https://global.discourse-cdn.com/ionicframework/original/3X/7/e/7e247744fd9704fea427b6edb29b34085989d427.png)

instead, it looks like this. With the gray background behind the icon

![image](https://global.discourse-cdn.com/ionicframework/original/3X/2/5/25c7dbd4d04edca7129009dc1931bfa32e9f6d69.png)

this is the html code

```auto
<button ion-button clear [routerLink]="['/edit-appointment/', booking.$key]">
          <ion-icon name="create" style="zoom:2.0"></ion-icon>
</button>
<button ion-button clear (click)="deleteBooking(booking.$key)">
          <ion-icon name="trash" style="zoom:2.0"></ion-icon>
</button>

```

Does anyone know how to make the icon clear?

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [March 16, 2020, 1:32pm UTC](https://forum.ionicframework.com/t/ionic-clear-button-not-working-properly-ionic-5/185140/2 "2020-03-16T13:32:17Z")

</div>

Buttons do not work like this anymore (as part of Ionic v4).

Please look at the Button docs

> **[ion-button - Ionic Documentation](https://ionicframework.com/docs/api/button)**
>
> Ionic is the app platform for web developers. Build amazing mobile, web, and desktop apps all with one shared code base and open web standards

---

<div class="post-metadata">

**Author:** ![Sylvinrodz](https://avatars.discourse-cdn.com/v4/letter/s/e68b1a/32.png) [@Sylvinrodz](https://forum.ionicframework.com/u/Sylvinrodz)\
**Post date:** [March 16, 2020, 6:37pm UTC](https://forum.ionicframework.com/t/ionic-clear-button-not-working-properly-ionic-5/185140/3 "2020-03-16T18:37:21Z")

</div>

```auto
<ion-button fill="clear" [routerLink]="['/edit-appointment/', booking.$key]">
          <ion-icon slot="icon-only" name="create" style="zoom:2.0"></ion-icon>
</ion-button>
<ion-button fill="clear" (click)="deleteBooking(booking.$key)">
          <ion-icon slot="icon-only" name="trash" style="zoom:2.0"></ion-icon>
</ion-button>

```