So it looks I can change the background-color of an empty md-checkbox by doing :
md-checkbox .md-icon {
background: red;
}
But I can't manage to change the background of a checked md-checkbox.
I tried to play with :checked, ::before, ::after... But didn't succeed.
How should I proceed ?
So it looks I can change the background-color of an empty md-checkbox by doing :
md-checkbox .md-icon {
background: red;
}
But I can't manage to change the background of a checked md-checkbox.
I tried to play with :checked, ::before, ::after... But didn't succeed.
How should I proceed ?
Share Improve this question edited Feb 1, 2019 at 22:32 G. Tranter 17.9k3 gold badges52 silver badges71 bronze badges asked Sep 3, 2015 at 13:39 ElloneEllone 3,89812 gold badges47 silver badges77 bronze badges 02 Answers
Reset to default 10You need to use theme class as well as md-checked class combination in order to define selector with higher specificity. For example:
md-checkbox .md-icon {
background: red;
}
md-checkbox.md-default-theme.md-checked .md-icon {
background: orange;
}
And of course, avoid using !important, this is a sign that something is wrong with your styles.
in new version added underscore ._md-icon:
md-checkbox.md-checked ._md-icon {
background-color: white;
}