我的应用程序中有一些使用许多不同修饰符类的按钮，这是一个示例
=ArrayFormula(if(R1:R<>"";"prfix"&row(T1:T);""))
我有一个类<button class="btn btn--compact btn--edit">
Button Text
</button>
，它使用btn-edit伪元素添加了背景图像，就像这样（注意，这是SCSS）
:before它运作良好，但是button元素也应该包含.btn {
&--edit:before {
background: url("ic_create_18x18.svg") no-repeat;
background-position: -3px 3px;
background-size: contain;
content: '';
filter: $filterWhite;
width: 18px;
height: 18px;
display: inline-block;
}
}
类，就像上面的示例一样，我希望使用其他大小的图标和其他一些CSS规则。因此，我需要覆盖类/使选择器更具针对性。我想这样的事情
btn--compact嗯...我的选择器不起作用，所以我将其更改为此
.btn--compact.btn--edit:before {
background: url("ic_create_16x16.svg") no-repeat;
background-position: -1px 2px;
height: 14px
}
这也不起作用！？！如何在也具有/包含类.btn--compact .btn--edit:before {}
的html标记/元素上将btn--edit类的：before伪元素定位到？
任何建议将不胜感激