使用引导程序滚动时修复标题

Question

我有一个大的引导表，当我尝试修复表时表失真，但标题是固定的。结果，一些行堆叠在一起使表变得扭曲。这是我的小提琴：https://jsfiddle.net/1veu9gz3/

如何解决这个问题？

CSS

    <table class="table table-bordered table-fixed" >
     <thead>
    <tr>
    <th>Fecha de la consulta</th>
    <th>Semana de amenorrea</th>
    <th>Peso (lb)</th>
    <th>Tension Arterial Max.Min. (mm Hg)</th>
    <th>Alt. Ulterina/Present Pubis.FondoCef/Pelv.Tr</th>
    <th>F.C.F.(lat./min./Mov.Fetal)</th>
    <th>Edema / Varices</th>
    <th>Otros</th>
    <th>Evolucion</th>
    </tr>
    </thead>
    <tr>
    <td><input type="text"  size="10"  /></td>
    <td><input type="text"  size="10"  /></td>
    <td><input type="text"  size="10"  /></td>
    <td><div class="input-group" ><input style="width:50px" class="form-control reduce-height" type="text"   /> <span class="input-group-addon reduce-height" >-</span> <input  type="text" class="form-control reduce-height" style="width:50px" /></div></td>
    <td><div class="input-group" > <input style="width:50px" class="form-control reduce-height" type="text"   /> <span class="input-group-addon reduce-height" >-</span> <input  type="text" class="form-control reduce-height" style="width:50px" /><span class="input-group-addon reduce-height" >-</span><input  type="text" class="form-control reduce-height" style="width:50px" /></div></td>
    <td><div class="input-group" ><input style="width:50px" class="form-control reduce-height" type="text"   /> <span class="input-group-addon reduce-height" >-</span> <input  type="text" class="form-control reduce-height" style="width:50px" /></div></td>
    <td><div class="input-group" ><input style="width:50px" class="form-control reduce-height" type="text"   /> <span class="input-group-addon reduce-height" >-</span> <input  type="text" class="form-control reduce-height" style="width:50px" /></div></td>
    <td><textarea style="width:150px" class="form-control" cols="20"></textarea></td>
    <td><textarea style="width:150px" class="form-control" cols="20"></textarea></td>
    </tr> 
    <tr>
     .
     .
     .
     </table>

HTML

public function userSearch()
{
    $users = [];
    $request = Request::createFromGlobals();
    $name = $request->query->get('name');

    $directoryService = $this->get('etiam_nexus_directory.service.directory');
    $localEstablishment = $directoryService->getLocalEstablishment();
    $allUsers = $directoryService->getAllUsers($localEstablishment, $_GET);

    for ($i = 0; $i <= count($allUsers); $i++) {
        $user = $allUsers[$i];
        if (substr(strtolower($user->getUserFullName()), 0, strlen($name)) === strtolower($name)) {
            $users[] = '@' . $user->getUseruniqname() . ":server";
        }
    }

    if(count($users) == 0) {
        return JsonResponse::create(
            array(
                'success' => false,
                'research' => $name
                )
        );
    }

    return JsonResponse::create(
        array(
                'success' => true,
                'research' => array (
                    'name' => $users
                )
        )
    );
}