Gradient in Tabelle

[Rolf b]

Ich möchte quer über eine Tabellenzeile einen Farbverlauf machen (ohne dabei zu hexen, indem ich die Gradienten pro Zelle mit Farbzwischenwerten neu aufsetze).

So wie im Fiddle geht's nicht, weil sich der Verlauf pro Zelle wiederholt. Die Lösung, die man anderswo findet, nämlich background-attachment:fixed, gefällt mir nicht weil sie sich auf die Breite des Viewport bezieht, nicht auf die Breite der Tabelle.

Kennt jemand eine bessere Lösung? Zur Zeit habe ich für mich den Gradienten einfach nach oben gedreht, dann fällt's nicht auf, aber ich würde den Verlauf gern von links nach rechts haben.

Das hier steht im Fiddle:

<table>
<tr>
  <td>Der Herr der Ringe</td><td>J.R.R. Tolkien</td><td>Peter Jackson</td>
</tr>
<tr>
  <td>His Majesty's Dragon</td><td>Naomi Novik</td><td><strike>Peter Jackson</strike>, leider</td>
</tr>
</table>

table {
  border-collapse: collapse; border: 3px solid black;
  width: 80%; margin: 0 auto;
}

tr:hover { background: linear-gradient(to right, #aaa, #faa); }

td { border-top: 2px dotted black; }

Rolf