Example of issue I'm having

如图所示，我遇到一个问题，当我的躯干滚动过去时，它的内容在thead上方可见。这是我正在使用的CSS：

    .tableFixHead{
        overflow-y: 0;
    }
    .tableFixHead table{
        border-collapse: collapse;
        width: 100%;
    }
    .tableFixHead th,.tableFixHead td{
        padding: 8px 16px;
    }
    .tableFixHead th{
        position: sticky;
        top: 0;
        background: #eee;
    }

和我想要这样做的HTML：

<div id="viewExamsModal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 id="examsModalTitle" class="modal-title">Exams</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times</span></button>
                </div>
                <div class="modal-body">
                    <div class="tableFixHead">
                        <table class="table table-hover">
                            <thead id="examsTableHead">
                                <tr>
                                    <th>#</th>
                                    <th>Exam</th>
                                    <th>Format</th>
                                    <th>Length</th>
                                    <th>Days Between</th>
                                    <th>active</th>
                                </tr>
                            </thead>
                            <tbody id="examsModalTableBody"></tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

我正在使用引导程序4，这是一个模态。任何帮助是极大的赞赏。