How to change fill color of check boxes in multiple answer matrix table? | XM Community
Skip to main content
Hi all,

The check boxes in my matrix table (likert, multiple answer) turn white after I select them. I would like the selected check boxes to turn teal (#44b8bd). I was able to successfully do this with the regular multiple and single answer questions with the following code:

.Skin label.MultipleAnswer.q-checked, .Skin label.SingleAnswer.q-checked {
background: #44b8bd;
Background-color: #44b8bd;
border-color:#44b8bd;
color: #000000;
}

.Skin label.MultipleAnswer.q-focused.q-checked, .Skin label.SingleAnswer.q-focused.q-checked {
background: #44b8bd;
}

I'm not sure how to make the selected check boxes in the matrix table the same color.

Can someone help?

Thanks!
Hello @ehoffman ,
Use the below CSS

.Skin label.MultipleAnswer.q-focused.q-checked, .Skin label.SingleAnswer.q-focused.q-checked {
background: #44b8bd;
}
.Skin label.q-checkbox.q-focused.q-checked{
outline:#44b8bd;
}
.Skin label.q-checkbox.q-checked.q-focused, .Skin label.q-checkbox.q-checked {
background-color:#44b8bd;
}
.Skin label.q-checkbox, .Skin label.q-radio {
border: 2px solid #44b8bd;
}
Can you clarify where to past in code like you provided above to make the alternate rows shaded? I see this is an option in the helpful but don't see how to actually do it. Also, does adding alternate row colors help with accessibility? Thank you!

Leave a Reply


Terms & Conditions