0

i want to style the span with class element-to-be-styled if the span inside of div with class container-a (this div has to be in the same parent-container as the container-b) has class error. To put it simple in the example below the first span with class element-to-be-styled should be styled e.g with background-color red. The solution for this problem should only be in CSS.

<div class="parent-container">
    <div class="container-a">
        <span class="error"></span>
    </div>
    <div class="container-b">
        <span class="element-to-be-styled"></span>
    </div>
</div>
<div class="parent-container">
    <div class="container-a">
        <span></span>
    </div>
    <div class="container-b">
        <span class="element-to-be-styled"></span>
    </div>
</div>

I tried with

div.parent-container .container-a > span.error + div.parent-container .container-b span.element-to-be-styled {
   background-color: red;
}

But it doesn't work. Is it possible with a solution only in css?

Thank you in advance.

AngularChan
  • 135
  • 1
  • 10

0 Answers0