Ion-list no separating lines


Is there a way to prevent the separating lines between items in an ion-list? I am putting the item content in a card and it looks awkward with the list lines there as well, I want the items to look like they’re floating above… Thanks!


Hi @emilywhou,

Using following css. you can hide the separator.

.list a.item
border-top: 0px;
border-left: 0px;
border-right: 0px;
border-bottom: 0px;




Works for me. thanks!


works for ionic creator, thanmks.


As per latest documentation: 2.0, no-lines works

    Item with no border


Thanks works fine in Ionic 2 :slight_smile:
Can you give me please the documentation link for this component?


Thanks… Worked for me.


this is the link for ion-item documentation, and look for no-lines


You’re right! :smile: thank you


hi , how to remove the line from the last item in a list ?

.item { border-style: none }


Use no-lines Here is the example:

<ion-item no-lines >

Working perfectlyPreformatted text for me.


For ion-list in ionic 4, use the attribute lines=“none” , this will remove the lines on ion-item elements