Comment aligner TH Header avec TD dans TBody

Je vais avoir des problèmes en essayant d'incorporer un tableau dans une page HTML existante avec un peu de CSS.

Cette CSS est de cacher l'en-tête de la table par défaut avec une définition de style comme:

.tablestuff thead {
     display: none;
}

Mais je veux que le tableau à afficher, j'ai donc essayé de définir le style sur le thead élément avec "display:block" (avec javascript). Qui fait la tête d'affichage, mais les colonnes de l'en-tête ne sont pas alignées avec le td colonnes.

J'ai réduit mon HTML pour la suite (je l'espère avec un minimum de fautes de frappe) et de montrer le style sur le thead élément défini par javascript.

<div class="tablestuff">
<table border="1">
<thead style="display:block">
<tr>
<th id="th1" style="width: 20px"></th>
<th id="th2" style="width: 20px"></th>
</tr>
</thead>
<tbody>
<tr>
<td headers="th1" style="width: 20px"></td>
<td headers="th2" style="width: 20px"></td>
</tr>
</tbody>
</table>
</div>

Comment puis-je faire à la fois l'en-tête de salon et aussi de s'aligner correctement avec le td colonnes?

source d'informationauteur George Hernando