The element that is designated by .label
is not the same element that is designated by div.liwrap
; rather, .label
is one of div.liwrap
's descendants. Specificity then becomes irrelevant, because the selectors are matching different elements altogether.
The strikethrough simply means that the div.liwrap
ancestor's color
is being canceled out instead of being inherited because you're giving .label
its own color
declaration.
If you want .label
to inherit from div.liwrap
on hover, you need to modify the following rule in your LESS code:
.dropdown li div.liwrap:hover {
border-color: #00aeef;
color: #00aeef;
}
To something like this:
.dropdown li div.liwrap:hover {
border-color: #00aeef;
color: #00aeef;
.label {
color: #00aeef; // Or color: inherit;
}
}