if child exists

Question

I'm trying to make some CSS as dynamic as possible, but for the next I'm having some issues making it work:

Say I have the following html and css so far:

nav.blended {
  color: red;
}
nav.blended + .optional-stuff {
  color: green;
}

<nav class="blended">
  <div class="substuff">
    should be green
  </div>
  <div class="optional-stuff">
    should be green
  </div>
</nav>

<nav class="blended">
  <div class="substuff">
    should be red
  </div>
</nav>

But now it always remains red.

codepen if needed: http://codepen.io/cskiwi/pen/GoRqPL?editors=110

Remove the `+` and it will work. + is used to select the sibling element and not child. — m4n0, Dec 04 '15 at 09:09
@ManojKumar this only make the second one green not the first one — Kiwi, Dec 04 '15 at 09:12

score 0 · Answer 1 · answered Dec 04 '15 at 09:09

0

.optional-stuff is not siblings of nav.blended.

nav.blended {
  color: red;
}
nav.blended .substuff + .optional-stuff {
  color: green;
}

<nav class="blended">
  <div class="substuff">
    should be green
  </div>
  <div class="optional-stuff">
    should be green
  </div>
</nav>

<nav class="blended">
  <div class="substuff">
    should be red
  </div>
</nav>

answered Dec 04 '15 at 09:09

Alex

8,461
6
37
49

this only make the second one green not the first one – Kiwi Dec 04 '15 at 09:12
@Kiwi Do you want to change color of `substuff`? – Alex Dec 04 '15 at 09:15
no the other one that says `should be green`, for me your example has only 1 green – Kiwi Dec 04 '15 at 09:19
@Kiwi It is not possible by pure css. You have to use javascript or jquery. – Alex Dec 04 '15 at 09:20
@Kiwi Check [this](http://codepen.io/alireza-safian/pen/adbmzG?editors=101). – Alex Dec 04 '15 at 09:26
Damn, was hoping it was possible – Kiwi Dec 04 '15 at 09:45
There is no parent selector in css3. [This](http://stackoverflow.com/questions/1014861/is-there-a-css-parent-selector) can help you. – Alex Dec 04 '15 at 09:47
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/96970/discussion-between-alireza-safian-and-kiwi). – Alex Dec 04 '15 at 10:46

if child exists

1 Answers1