Why my star is not appearing in YELLOW ? How to fix it ?
Here's the relevant code for the above issue.
HTML
<div class="tpl" data-favorite="1">
<div>
<span class="favorite">★</span>
<span class="text">Italian Pizza: salmon, olives, onion, tomato, blue-cheese</span>
</div>
</div>
CSS
[data-favorite=1] {
background: #AAA;
border-left: 3px solid green
}
.favorite {
font-size: 2em;
padding: 0 1 0 1em;
}
[data-favorite=1] .favorite {
color:yellow;
}
[data-favorite=0] .favorite {
color:#AAA;
}
You'll want to use
[data-favorite="1"] {}
The difference being the quotes "" around the value.
Here's the working jsFiddle