css - Override SASS class -

i want define style components use filter list. made class select of them, , want override of selected classes. code being worth thousand words :

div[class*="filter-"] {       (some property) }  .filter-specific {    (do more specific) }

but reason doesn't work. though order of definition important doesn't appear case. , can't put !important everywhere. doing wrong ?

that's because css specificity.

div[class*="filter-"] has better specificity (div + [class*="filter-"]) .filter-specific.

if .filter-specific div, can use like:

div[class*="filter-"] {    color: red;  }    div.filter-specific {    color: blue;  }

<div class="filter-foo">bar</div>  <div class="filter-specific">spec</div>

Insert