CODEWITHSUNDEEP
csscss-selectors
user1589188
user1589188

Reputation: 5736

Select CSS nested class having a certain class above

I want to apply some style to the tag with "target-class" ONLY when there is another tag with "source-class" ABOVE it. So it can be either at the same level, which can be easily solved by .source-class ~ .target-class, or inside some parent class(es), like:

<div class="source-class">class to look for</div>
<div class="parent-class">
    <div class="target-class">class to apply</div>
</div>

but does not need to check inside another tag, like:

<div>
    <div class="source-class"></div>
</div>
<div class="parent-class">
    <div class="target-class">nothing to apply</div>
</div>

How would you write such CSS selector? Thank you!

Upvotes: 0

Views: 529

Answers (1)

vanowm
vanowm

Reputation: 10221

.source-class ~ .target-class,
.source-class ~ * > .target-class
{
  /* your style here */
}

If you want unlimited children levels, just remove >

Upvotes: 2

Related Questions