Reputation: 18123
Why does my toggleclass not work?
(The toggleclass()
doesnt work, but it should work)
Upvotes: 0
Views: 561
Reputation: 34227
Place the desired override last. Also, you can apply !important to the style but to ensure that if another is given !important, the sequence will still weigh higher. Your fiddle page also had an extra }
at the end.
.userGridViewItem{
background: brown;
color: #fff;
width: 200px;
height: 100px;
}
.warningYellow{
border: 3px solid yellow;
}
.warnings_receiver_highlight{
background: #000 !important;
color: #000 !important;
}
Upvotes: 0
Reputation: 8941
If I'm understanding what you want, all you should have to do is place the styles in your css for warnings_receiver_highlight
after your styles for userGridViewItem
.
Upvotes: 1
Reputation: 86902
The toggle class is working fine it is your CSS that is messed up I have a corrected fiddle here http://jsfiddle.net/xH8ME/2/
Basically you have the two classes defined below. Since your divs have both classes how does the browser know which background should be applied? Because .userGridViewItem is defined first in the element that is the class that it pulls the background color from. To make this work properly you need to use the !important
at the end of the attribute or make your CSS classes more specific like div.warnings_receiver_highlight
or .userGridViewItem.warnings_receiver_highlight
.warnings_receiver_highlight{
background: #000;
color: #000;
}
.userGridViewItem{
background: brown;
color: #fff;
width: 200px;
height: 100px;
}
Upvotes: 0
Reputation: 623
I believe your code is working correctly, you just seem to be having an issue with CSS specificity (http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/). One solution would be to add !important
to the attributes under .warnings_receiver_highlight
Upvotes: 0
Reputation: 76268
It's working but the styles are getting overriden.
Try with this:
.warnings_receiver_highlight {
background: #000 !important;
color: #000 !important;
}
Demo: http://jsfiddle.net/xH8ME/3/
Upvotes: 1