JSFiddle - React, Tailwind, and code Playground

HTML

<div class=content>
<h1>Testing sticky thead without script</h1>
    <p>Advantage: fast, no scripts, no double scrollbars</p>
    <p>Disadvantage: double thead, fixed td-width, small glitch on overlap of thead</p>
    <p>Tested in Safari and Firefox</p>
</div>
<div class=fixed>
<table>
    <thead>
    <tr><th>th1</th><th>th2</th><th>th3</th></tr>
    </thead>
</table>
</div>
<div>
<table>
    <thead>
    <tr><th>th1</th><th>th2</th><th>th3</th></tr>
    </thead>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td content</td><td>td content</td></tr>
    <tr><td>td content</td><td>td...

CSS

body{
    font-family: sans-serif;
}

h1{
    font-size: 2em;
}

p{
    margin-top: 1em;
}
div{
    padding: 0 50px
}

.fixed{
    position: fixed;
    top: 0;  
    z-index: 0;
}
.content{
    position: relative;
    background: #fff; 
    z-index: 1;
    padding: 50px;
}

th,td{
    width: 200px;
    padding: 3px;
}

th{
    background: #ccc;
}