Remove ion item divider

Question

How I can remove <ion-item> divider? I have the following code to show 4 items in a row:

<ion-row ion-list>     <ion-col width-25 *ngFor="let player of players">               <ion-item color="dark">                   <ion-avatar item-left>                       <img [src]="photo" class="img img-circle"/>                   </ion-avatar>                   {{user.name}}               </ion-item>               </ion-col>             </ion-row> 

and the output shows 4 images in a row, as excepted, but each image has a white divider below it. I don't want any divider.

I tried to set style="border:none" but it didn't do it.

Answer 1

For whatever reason, this didn't work for me. But having lines="none" worked great.

For ionic v4

<ion-item lines="none">...</ion-item>

Pulled from ionic docs. https://ionicframework.com/docs/api/list

Answer 2

This is for ionic 2 and 3. Please refer to this answer for higher versions of ionic

use no-lines

<ion-row ion-list>     <ion-col width-25 *ngFor="let player of players">          <ion-item no-lines color="dark"><!-- here -->               <ion-avatar item-left>                   <img [src]="photo" class="img img-circle"/>               </ion-avatar>               {{user.name}}          </ion-item>      </ion-col> </ion-row>