Seletor CSS: not (). Aplicar estilo se o pai não existir
Estou tentando aplicar um estilo a uma div com base em sua classe pai. Estou usando o seletor: not () para selecionar a div cujo pai não é.container1
, a segunda div deve ser vermelha, mas não está funcionando.
Exemplo 1
.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>
Exemplo 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>
Isso é possível com CSS? Ou minha sintaxe está desativada?