Ich habe in einer HTML-Seite viele Tabellen, von denen einige nur verwendentr & td andere nutzen alles, was sie können:thead, tbody, tfoot, tr, th & td.

Aufgrund einiger Probleme verwenden wir eine CSS-Regel, um den oberen und linken Rand der Tabelle und alle zu erstellentd hat einen eigenen rechten und unteren Rand.

Weil wir diese besondere Sache brauchen, um das zu bekommentdist in allen vier ecken und um die jeweilige ecke.

Wie kann ich eine einzelne Regel erstellen, mit der nur die erste Zeile in der Tabelle ausgewählt werden kann?

Ich verwende diese Regel bisher:

table.unit tr:first-child td:first-child, table.units thead tr:first-child th:first-child {
  border-top-left-radius: 10px;
}
table.unit tr:first-child td:last-child, table.units thead tr:first-child th:last-child {
  border-top-right-radius: 10px;
}

In dieser Jsfiddle können Sie mein Problem sehen: (http://jsfiddle.net/NicosKaralis/DamGK/)

Gibt es eine Möglichkeit, die beiden Implementierungen gleichzeitig zu lösen?Wenn ja, wie kann ich das machen?Wenn nicht, können Sie mir dabei helfen, den besten Weg zu finden?

P.S .: Ich kann das Element der Tabellen ändern, aber es wird in Bibliotheken von Drittanbietern viel mehr umgestalten, also wollen wir das nicht ändern.