# Multi-State Button Custom Styles Disabled

**URL:** <https://forum.inductiveautomation.com/t/multi-state-button-custom-styles-disabled/71164>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [March 16, 2023, 1:52pm UTC](https://forum.inductiveautomation.com/t/multi-state-button-custom-styles-disabled/71164 "2023-03-16T13:52:07Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![amarks](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/amarks/32/45610_2.png) [@amarks](https://forum.inductiveautomation.com/u/amarks)\
**Post date:** [March 16, 2023, 1:52pm UTC](https://forum.inductiveautomation.com/t/multi-state-button-custom-styles-disabled/71164/1 "2023-03-16T13:52:07Z")

</div>

I have a multistate button with custom selected and unselected styles applied to each button. These styles have been defined using the custom style GUI (`Buttons/MultiState/Duty1/Selected` and `Buttons/MultiState/UnSelected`).

When I disable this multi-state button I would like the buttons to gray-out. I tried adding this to the stylesheet.

```auto
.psc-Buttons/MultiState/Duty1/Selected:disabled{
	background-color: var(--neutral-30);
	border-color: var(--neutral-30);
}

.psc-Buttons/MultiState/UnSelected:disabled{
	background-color: var(--neutral-30);
	border-color: var(--neutral-30);
}

```

But that doesn't seem to do anything.

I also looked at the built-in CSS files to see how the buttons handle enabled/disabled and saw

```auto
.ia_button--primary--disabled {
    background-color: var(--callToAction--disabled);
    border: var(--border--disabled);
    color: var(--neutral-30);
    cursor: not-allowed;
}

```

So I tried

```auto
.psc-Buttons/MultiState/Duty1/Selected--disabled{
	background-color: var(--neutral-30);
	border-color: var(--neutral-30);
}

.psc-Buttons/MultiState/UnSelected--disabled{
	background-color: var(--neutral-30);
	border-color: var(--neutral-30);
}

```

And that did not work (I didn't really expect it to)

I can create bindings based on the enabled property of the multistate button to change the style for the buttons, but I don't really want to do that for every multi-state button that I use.

Any way to do this with the CSS stylesheet?

---

<div class="post-metadata">

**Author:** ![amarks](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/amarks/32/45610_2.png) [@amarks](https://forum.inductiveautomation.com/u/amarks)\
**Post date:** [March 21, 2023, 6:15pm UTC](https://forum.inductiveautomation.com/t/multi-state-button-custom-styles-disabled/71164/2 "2023-03-21T18:15:46Z")

</div>

So I guess that I'll have to go the "manual" route to swap the style based on the enabled state.