Hello,
I am aware that the ion-list
has the options for lines
to be inset
or full
or none
. However I’d like to still have the inset lines, but to remove the border on the bottom from the last item, and add a border at the top to the first.
So far this is what I have that works for the full-width top and bottom border
global.scss
:
.outer-content ion-list {
border-bottom: solid 1px rgb(200, 199, 204, 1) !important;
}
.outer-content ion-list ion-item:first-of-type {
border-top: solid 1px rgb(200, 199, 204, 1) !important;
}
However the bottom border CSS does not work, although I can style the element in the same way via chrome inspector.
This is what I am using to attempt to target the bottom border:
.outer-content ion-list ion-item .item-inner:last-of-type {
border-bottom: none !important;
}