How to choose an element that does not have leading or trailing text nodes?

I experimented using a pseudo-class :only-child, but unfortunately this does not seem to consider text nodes:

<style type="text/css">
  div span:only-child {
    color: red;
  }
</style>

<div>
  Test
  <span>This still becomes red :(</span>
</div>

<div>
  <span>This becomes red, as it should!</span>
</div>
<div>
  <span>This does not become red - great!</span>
  <span>This does not become red - great!</span>
</div>

I am trying to find a way to detect when a particular element is completely alone in its container element in a situation where I cannot introduce new classes.

Is there a way to achieve this using CSS?

+4
source share
2 answers

Is there a way to achieve this using CSS?

Unfortunately not.

The old article in the CSS Working Group error list lacks the idea that ..

. , , , CSS.

, CSS ( ) , .

, ... , .

+3
div:nth-child(2) span {
color: red;
}

https://jsfiddle.net/cmckay/8663aLcg/

0

All Articles