将标题和数据与大型数据集的可滚动html表对齐

我已经从一个mysql数据库构建了一些动态生成的表，并且正在尝试对其进行设置，以便数据行可以滚动，而头行不会滚动。这样，您就不必滚动回页面顶部来查看正在查看的列

到目前为止，我的解决方案是将标题分离到自己的表格中，然后滚动一个只包含以下数据的表格：

<table id='box-table-a' border='0' width='100%'>
     HEADER ROWS
</table>

<div style='resize:vertical; height:500px; width:100%; overflow:auto;'>";
    <table id='box-table-a' border='0' width='100%'>";
       DATA
    </table>
</div>

---

这在某种程度上是可行的，但标题和数据行中的列的宽度不同，请参见图。关于如何使各列相互对齐，您有什么建议吗？

谢谢您的链接。我可能会满足于其中的一种解决方案，尽管我想找到一些方法，如果可能的话，不使用固定列宽。