Ich versuche, einen Stil auf ein div anzuwenden, der auf seiner übergeordneten Klasse basiert. Ich verwende den Selektor: not (), um den Div auszuwählen, dessen Elternteil nicht @ is.container1, der zweite div sollte rot sein, aber es funktioniert nicht.

Beispiel

.myDiv:not(.container1) > .myDiv {
  color: red;
}

<div class="container1">
  <div class="myDiv">Div 1</div>
</div>

<div class="container2">
  <div class="myDiv">Div 2</div>
</div>

Beispiel 2

.myDiv:not(.container1 .myDiv) {
  color: red;
}

<div class="container1">
  <div class="myDiv">Div 1</div>
</div>

<div class="container2">
  <div class="myDiv">Div 2</div>
</div>

Ist das überhaupt mit CSS möglich? Oder ist meine Syntax einfach weg?