Border-bottom I can't remove

Question

I'm stuck in IONIC 2 for removing something like a border-bottom on ion-item tag as presented in the picture attached.

Picture of the border I want to remove

My code is below:

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-item class="header-item">
      <ion-avatar item-start>
        <ion-icon name="add-circle"></ion-icon>
      </ion-avatar>
      <ion-title>Gallerie</ion-title>
    </ion-item>
  </ion-navbar>
</ion-header>

And my CSS below:

.header-item {
        background: transparent;
        border: none;
    }

Have you any idea? Thanks for your help!

Answer 1

Just like you can see in in the docs, you can use the no-lines attribute to remove that line:

<ion-item no-lines>
  Item with no border
</ion-item>