Is it possible to use :not pseudo selector containing adjacent sibling combinator?

Question

What I am trying to achieve - when table footer is rendered, I want to remove the border radius from the table cells within the last tr inside table body. Not sure if the following code should even work:

table tbody:not(+ tfoot) tr td {
  border-radius: 0;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

td {
  border: 1px solid;
  border-radius: 4px;
  background-color: red;
}

table tbody:not(+ tfoot) tr td {
  border-radius: 0;
}

<table class=with-footer>
  <tbody>
    <tr><td>Body cell</td></tr>
    <tr><td>Body cell</td></tr>
  </tbody>
  <tfoot>
    <tr><td>Footer cell</td></tr>
  </tfoot>
</table>

I am open to other suggestions too, maybe I am overcomplicating the task.

Related (the canonical duplicate target): https://stackoverflow.com/questions/1817792/is-there-a-previous-sibling-selector?rq=1 although it does not have the specific solution (`:last-child`) that Ry's answer here recommends. — TylerH, Mar 28 '23 at 15:23
FWIW, `:has()` works in all major browsers except Firefox, and can be enabled via flag in Firefox (though performance is still buggy, obviously). _Hopefully_ it won't be more than another version or two before Firefox rolls out full support for it. — TylerH, Mar 28 '23 at 15:24
@TylerH yeah, it is sad FF is behind. I am not too worried about FF at the moment, so might end up using `:has`. (@Temani Afif your answer was valid, but it so happened that I checked the proposed solution in FF :D) — Morpheus, Mar 28 '23 at 15:34

score 2 · Accepted Answer · answered Mar 28 '23 at 15:10

You can be more compatible (including with current Firefox) with :last-child:

table {
  border-collapse: separate;
  border-spacing: 0;
}

td {
  border: 1px solid;
  border-radius: 4px;
  background-color: red;
}

table > tbody:not(:last-child) > tr:last-child > td {
  border-radius: 0;
}

<table class=with-footer>
  <tbody>
    <tr><td>Body cell</td></tr>
    <tr><td>Body cell</td></tr>
  </tbody>
  <tfoot>
    <tr><td>Footer cell</td></tr>
  </tfoot>
</table>

Is it possible to use :not pseudo selector containing adjacent sibling combinator?

1 Answers1