Can you apply CSS rules, in CSS, if a div doesn't exist?

Question

Is this possible, with CSS ?

Apply this rule if .div1 doesn't exist:

.div2{
  property: value;  
}

like

<div class="div1">
...
</div>

<div class="div2">
 <!-- it exists, so do nothing -->
</div>

and

<div class="div2">
 <!-- it doesn't exist, apply the css -->
</div>

Answer 1

Exists, or doesn't exist? Your question confuses me :)

---

Apply style to .div2 if .div1 exists:

Option 1: .div2 follows directly after .div1

.div1 + .div2 {
  property: value;
}

Option 2: .div2 follows .div1 as a sibling:

.div1 ~ .div2 {
  property: value;
}

---

Style .div2 without .div1:

It's a bit of a hack, but you could do the reverse. Style .div2 normally, and then override the styling with the selectors above.

If .div1 doesn't exist, .div2 gets the normal styling.

.div2 {
  background: #fff;
}

.div1 + .div2 {
  background: #f00; /* override */
}

/* or */

.div1 ~ .div2 {
  background: #f00; /* override */
}