scroll - セメンティックUIの固定テーブルヘッダーを使用して、div内でテーブルをスクロール可能にする方法は?

Question

div 内でテーブルをスクロール可能にしましたが、すべて正常に動作していますが、テーブル ヘッダーがスクロールしすぎています。テーブル ヘッダーを固定したいと考えています。そして、このテーブルは div 内でレンダリングされます。ページングに PahingHelper モデルを使用しました。テーブルでスクロール可能を使用しようとしましたが、機能していません。スクロール可能なテーブルを作成するためにここにいます。テーブルをスクロール可能にする方法はありますか? // ここにスクロールのサンプル コードがあります

@model ShresthaTrade.Helper.PagingHelper
    <table >
            <tr>
                <th>Brand</th>
                <th>Machine Type</th>
                <th>Machine Model</th>
                <th>Machine Serial</th>
                <th>Mac Address</th>

        </tr>
        </table>
<div style=" overflow:auto; height: 340px;">
    <table >
        <tbody>
            @if (Model.Datatable.Rows.Count > 0)
            {
                foreach (System.Data.DataRow row in Model.Datatable.Rows)
                {
                    <tr>
                        <td>@row["brand_name"]</td>
                        <td>@row["machine_type_name"]</td>
                        <td>@row["MachineModel"]</td>
                        <td>@row["MachineSerial"]</td>
                        <td>@row["MacAddress"]</td>
                    </tr>

                }
            }
            else
            {
                <tr>
                    <td colspan="4">No records are found</td>
                </tr>
            }
        </tbody>
    </table>
</div>