Как добавить CSS для элемента, используя не селектор

Question

Я использую sass в своем проекте для применения стилей CSS, здесь у меня есть элементы div, где все div имеют одинаковые классы, за исключением нескольких div s,

пример: html

<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col not-wrap"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col not-wrap"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>

выше html имеет несколько div с именем класса wrapper-col, но немногие div имеют также класс not-wrap, здесь у меня есть scss, в котором я хочу применить стили, имеющие имя класса wrapper-col, но не not-wrapкласс без изменений HTML

вот что я пробовал, но он не работает для меня.

SCSS:

.wrapper-col{
    &:not(.not-wrap){
        p{
            /* styles here*/
        }
    }
}

Answer 1

Пример, который вы передаете, отлично работает!

Добавьте в качестве примера границу, и вы увидите ее: https://jsfiddle.net/o7hjv1ts/1/

.wrapper-col{
    &:not(.not-wrap){
        p{
            border: 1px solid red;
        }
    }
}