Select the containing tr of an active a tag with only css

Question

<tr>
    <td>
        <a href="some-link" class="active">some text</a>
    </td>
</tr>

<tr>
    <td>
        <a href="some-link">some text</a>
    </td>
</tr>

I can only use css selector properties to select the tr and add some properties to it if my anchor tag is active without any JS or JQuery. Please help!

In short, You can't. There is no way to select parent element with css. May be in future it is possible but not now. There is a proposed [**:has()**](https://developer.mozilla.org/en-US/docs/Web/CSS/:has) selector but it is not supported by any browser yet. — Mohammad Usman, Dec 13 '16 at 07:00
If the table row consists of only one cell, why not make the fill the entire cell (`display:block, width:100%; height:100%` etc) and then it will look like the whole cell is highlighted. — Mr Lister, Dec 13 '16 at 07:15
Possible duplicate of [Is there a CSS parent selector?](http://stackoverflow.com/questions/1014861/is-there-a-css-parent-selector) — random_user_name, Dec 13 '16 at 17:45

score 0 · Accepted Answer · edited May 23 '17 at 12:01

0

As someone already suggested here, the best way would be to simply add an "active" class to your tr

<tr class="active">

edited May 23 '17 at 12:01

Community

1
1

answered Dec 13 '16 at 07:41

Florin Asavei

38
6

Select the containing tr of an active a tag with only css

1 Answers1