0

I have a element that I can give a class.

This element has a parent and it is not possible to give a class to it's parent as it is generated by a library.

Is it possible to style this element's parent with css.

The code looks like this:

   <div>
      <p>Lorem Ipsum</p>
      <p class="another-elem-wraper">Test</p>
      <p>Lorem Ipsum <span>Lorem Ipsum</span></p>
    </div>
    <div>
      <p>Lorem Ipsum</p>
      <p class="elem-wraper">Test</p>
      <p>Lorem Ipsum <span>Lorem Ipsum</span></p>
    </div>
     ...

So, basicly I would like to style 2nd div using the class elem-wraper.

Here is the codepen link: https://codepen.io/anon/pen/axWwzg

I tried

div.elem:has(> p.elem-wraper){border: 1px solid red !important; }

.elem:contains-selector(.elem-wraper) { background: red; }

.elem-wraper:parent {  border: 1px solid red !important;}

.elem-wraper::parent { border: 1px solid red !important; }

 div.elem < p.elem-wraper{border: 1px solid red !important; }

But none of them worked. I would appreciate if you can advise if this is viable.

Johnny
  • 386
  • 1
  • 3
  • 11
  • 3
    As what the name suggests, the rules in CSS only *cascades* down the DOM tree: you cannot traverse up the DOM tree as of yet. – Terry Apr 11 '19 at 11:29
  • If you don't have access to the source, but you can style using CSS, can you use JS? If so you can add some extra classes this way and then style using CSS. – Dean Apr 11 '19 at 12:06

0 Answers0