Ionic 4: ion-segment-button background color

Ionic Framework
1

The ion-segment-button background style does not appear to function correctly on a web browser.
I would like the background of the ion-segment-button to always be ‘white’.

In global.scss I tried modifying

ion-segment-button {
–background: #ffffff;
–background-activated: #ffffff;
–background-checked: #ffffff;
–background-hover: #ffffff;
}

And this did not have any effect on the background color. Also after selecting buttons multiple times the background color shade seems to be off as well. See attachment.

51%20AM
Screen Shot 05-31-19 at 10.51 AM.PNG1502×99 4.68 KB

Any suggestions?

2

@MikeBauer
It is not working in ios version of Ionic 5.x
For now, please use mode="md" in ion-segment like this.
<ion-segment mode="md">

3

Just add this to your scss:


ion-segment-button{
  --background-checked: any color you want;
  --indicator-color: transparent!important; //must include this, it is the solution
}

Hope it’ll help,
Cheers!!!