Werfen Sie einen Blick hinter die Kulissen.

Das könnte wirklich viel einfacher gemacht werden. Raten Sie, wieviel Markup in dieser kleinen Tabelle ist! 13.7k. Sie hat 17 Zeilen und 9 Spalten. Und habe ich die ganzen Spacer GIFs erwähnt?
Es sind definitiv zu viele Tabellenzellen und Platzhalter. Und die ganzen gepunkteten Rahmenlinien werden mit dem background Attribut in Zellen gemacht, was nicht valide ist.
• Eine verschachtelte Tabelle? Wozu?
• Um eine Liste zu machen? Das ist ein Witz, oder?
Das alles könnte mit 8 Tabellenzellen und 4 CSS Regeln gemacht werden. Wirklich! 8 Zellen und 4 CSS Regeln, mehr ist nicht nötig.
• Oh nein, noch eine Tabelle, die sich als Liste ausgibt.
• Schreiben Sie Ihre Liste als Liste und lassen Sie CSS den Rest übernehmen.
Sie brauchen eine Regel für <table>, eine für <td>, eine für <ul> und eine für <li>. Das ist alles.
• Das ist besser als noch 8 Tabellenzellen zu benutzen um eine Liste vorzutäuschen, die dann nichtmal barrierefrei ist.
• Exzellent! Die letzte geschummelte Liste.

Der Code für die Tabellenstruktur:

table { margin: 3px; padding: 2px; border: solid 2px blue }

td { padding: 2px; border-style: solid; border-width: 1px; border-color: gray gray silver silver }