0

While jquery supports it, CSS3 itself does not. I'm trying to target elements that have specific siblings.

In jquery, I have $('tr:has(+tr.childrow)') which lets me target table rows that have another TR immediately under it with the childrow class.

I considered tr:not(.childrow) which targets all my non child rows, but it's not quite the same as I could have some rows that aren't followed with a child row.

In other words, target only the rows that have an adjacent sibling with a childrow class

<tr><td></td></tr>                    // select me
<tr class="childrow"><td></td></tr>   //   don't select me
<tr><td></td></tr>                    //   don't select me
<tr><td></td></tr>                    //   don't select me
<tr><td></td></tr>                    // select me
<tr class="childrow"><td> </td></tr>  //   not me either

Only solution I can think of is to add a class to the "parent" rows and target that directly.

Phaelax z
  • 1,814
  • 1
  • 7
  • 19
  • I am confused by your question, what are you trying to achieve ? You are trying to select every `tr` that has a class `childrow` via CSS, because there is no `tr` wrapper in the html example that you provided? – Nicolae Maties Dec 13 '19 at 16:00
  • I guess a "previous sibling" would be another way to look at it, in which it looks like I will have to add additional markup to select my targets. Nicolae, I'm trying to select every TR that comes before a TR containing the childrow class – Phaelax z Dec 13 '19 at 16:06
  • What is the difference between first `tr` with `//select me` and third `tr` with `//don't select me` ? – Nicolae Maties Dec 13 '19 at 16:11
  • I don't know how to explain any easier. They have different adjacent siblings. One is followed by a childrow class, the other is not. – Phaelax z Dec 13 '19 at 16:28

0 Answers0