<p dir="auto">Please consider adding a class named table-fixedheader that can be applied to a table so that the body scrolls under fixed headers.</p>
<p dir="auto">See this JSFiddle for a working demo:  <a href="http://jsfiddle.net/drueter/yqgB5/3/" rel="nofollow">http://jsfiddle.net/drueter/yqgB5/3/</a></p>
<p dir="auto">All that is needed:</p>
<div class="highlight highlight-source-css notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="table.table-fixedheader&gt;tbody {
    display: block;
}

table.table-fixedheader&gt;tbody {
    overflow-y: auto;
    height: 50px; /*placeholder:  override as needed*/
}

table.table-fixedheader&gt;thead&gt;tr&gt;th, table.table-fixedheader&gt;tbody&gt;tr&gt;td {
    float: left;
    width: 100px; /*placeholder:  override as needed*/
}"><pre class="notranslate"><span class="pl-ent">table</span>.<span class="pl-c1">table-fixedheader</span><span class="pl-c1">&gt;</span><span class="pl-ent">tbody</span> {
    <span class="pl-c1">display</span><span class="pl-kos">:</span> block;
}

<span class="pl-ent">table</span>.<span class="pl-c1">table-fixedheader</span><span class="pl-c1">&gt;</span><span class="pl-ent">tbody</span> {
    <span class="pl-c1">overflow-y</span><span class="pl-kos">:</span> auto;
    <span class="pl-c1">height</span><span class="pl-kos">:</span> <span class="pl-c1">50<span class="pl-smi">px</span></span>; <span class="pl-c">/*placeholder:  override as needed*/</span>
}

<span class="pl-ent">table</span>.<span class="pl-c1">table-fixedheader</span><span class="pl-c1">&gt;</span><span class="pl-ent">thead</span><span class="pl-c1">&gt;</span><span class="pl-ent">tr</span><span class="pl-c1">&gt;</span><span class="pl-ent">th</span><span class="pl-kos">,</span> <span class="pl-ent">table</span>.<span class="pl-c1">table-fixedheader</span><span class="pl-c1">&gt;</span><span class="pl-ent">tbody</span><span class="pl-c1">&gt;</span><span class="pl-ent">tr</span><span class="pl-c1">&gt;</span><span class="pl-ent">td</span> {
    <span class="pl-c1">float</span><span class="pl-kos">:</span> left;
    <span class="pl-c1">width</span><span class="pl-kos">:</span> <span class="pl-c1">100<span class="pl-smi">px</span></span>; <span class="pl-c">/*placeholder:  override as needed*/</span>
}</pre></div>
<p dir="auto">See comments in JSFiddle for usage notes.  This seems to work well.</p>
<p dir="auto">Would be nice to have a simple way to have the headings of a table stay at the top of a table as you scroll the page. Think long list of employee data.</p>
<p dir="auto">Would be nice to have this integrated in so it's aware of the other fixed elements like the navbar and will adjust blocking accordingly.</p>
<p dir="auto">Maybe something like:<br>
&lt;table class="table-fixed-header"&gt;<br>
&lt;thead&gt;<br>
&lt;tr&gt;<br>
or<br>
&lt;table&gt;<br>
&lt;thead class="fixed"&gt;<br>
&lt;tr&gt;</p>