JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
            <table>
                <thead>
                    <tr>
                        <th>Start</th>
                        <th class="fix">Datei</th>
                        <th>Abspielen</th>
                        <th>Dauer</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>00:00:00</td>
                        <td>file_1.mp4</td>
                        <td>-</td>
                        <td>00:30:00</td>
                    </tr>
                    <tr>
                        <td>00:30:00</td>
                        <td>file_2.mp4</td>
                        <td>-</td>
                        <td>00:20:00</td>
                    </tr>
                    <tr>
                        <td>00:50:00</td>
                        <td>file_3.mp4</td>
                        <td>-</td>
                        <td>00:20:00</td>
                    </tr>
                    <tr>
                        <td>00:00:00</td>
                        <td>file_4.mp4</td>
                        <td>-</td>
                        <td>00:30:00</td>
                    </tr>
                    <tr>
                        <td>00:30:00</td>
                        <td>file_5.mp4</td>
                        <td>-</td>
                        <td>00:20:00</td>
                    </tr>
                    <tr>
                        <td>00:50:00</td>
                        <td>file_6.mp4</td>
                        <td>-</td>
                        <td>00:20:00</td>
                    </tr>
                </tbody>
            </table>
        </div>

CSS

.container {
  height: 60px;
  overflow: auto;
}

thead
{
  position: sticky;
  top: 0;
  background-color:lightgray;
}

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
  padding: 4px 6px 4px 6px;
}

.fix {
  width:100%;
  /* em, rem, %, vh */ 
}