Header row behaviour during scrolling (using Bootstrap V4)

Getting help Questions
1

I’m using CE 0.37, along with Bootstrap V4 (my CSS details below in case they are relevant) and noticed that though I have scrolling ~working, the behaviour is that the header row scrolls up and away as I scroll down. This is in contrast to my expectation that the header row should remain visible, and also with the various demos and samples I see dotted around the place.

I suspect that my container settings are part of the problem: I am using a fixed width/height with NO overflow setting. The demo linked above says the container should have fixed width/height and “overflow: hidden”, but when I try that, I get no scrollbars at all. My current container settings and the surrounding context are as follows:

<div class="tab-content col-sm-12 table-responsive" style="padding-left: 0" id="nav-tabContent">
<div class="tab-pane fade handsontable htColumnHeaders active show" style="width: 100%; height: 400px;" id="nav-Logs" role="tabpanel" aria-labelledby="nav-Logs-tab" data-initialstyle="width: 100%; height: 400px;" data-originalstyle="width: 100%; height: 400px;">
<div class="ht_master handsontable" style="position: relative;">
<div style="position: relative; width: 1110px; height: 414px;" class="wtHolder">

I’m not especially familiar with Web front end development, but to my eye (using Firefox’s debug facilities) it looks as though the scrollbars I get (without “overflow” being set) might actually be provided by the container, not HOT. Am I right in thinking that the key is to get scrolling working with “overflow: hidden”? I’d appreciate any pointers or hints.

Thanks in advance, Shaheed

P.S. Here are my homebrewed Bootstrap V4 CSS integration settings (none of the integrations I found using Google appeared up-to-date, or even working):

<style>
    .copyPaste,
    .ht_clone_left,
    .ht_clone_top,
    .ht_clone_top_left_corner {
        display: none;
    }
    .ht_master thead,
    .ht_master .rowHeader {
        background: hsl(230,20%,75%);
    }
    .wtBorder {
        display:none !important;
    }
    .columnSorting::after {
        content: " ◆";
        color: hsl(230,20%,55%);
    }
    .columnSorting.ascending::after {
        content: "▲";
    }
    .columnSorting.descending::after {
        content: "▼";
    }
</style>