Cannot style ion-item on Ionic 4 (set background)

Ionic Framework
1

It’s not possible to set the background (color) of ion-item using css.
This doesn’t work:

<ion-item style="background-color:red;">

But setting the color does work:

<ion-item style="color:white;">

Is there a way to set the background?

2

Did you read about shadow dom?
https://www.joshmorony.com/styling-a-shadow-dom-in-ionic-4/

1 Like
3

Set it like this:

ion-item {
  --ion-background-color: #e9ebee !important;
}
1 Like
4

use this in your .scss page
ion-item {
–ion-background-color: #ffffff !important;
}

5

How do we set dynamic background colors? I need to render ion-item elements based on an array. I need to set the background color in the ngFor loop, coming from each value in the array. doesn’t work because of Shadow DOM. any ideas?