表格主体、头部重叠和表格宽度未扩大

Question

我已经使用 ngtable 在 angularjs 中创建了一个应用程序，因为我需要修复表头我尝试使用 position:fixed; 来固定头部，但问题是现在身体和头部也重叠了表格没有展开

我的代码如下所示

JSFiddle

html

<div ng-controller="IndexCtrl">
    <table border="1" ng-table="mytable" id="myTable" class="ScrollArea">
        <tbody ng-repeat="peop in $groups">
            <tr ng-repeat="people in peop.data">
                <td sortable="id" data-title="'Id'">{{people.id}}</td>
                <td sortable="desig" data-title="'Desig'">{{people.desig}}</td>
                <td sortable="name" data-title="'Name'">{{people.name}}</td>
                <td sortable="place" data-title="'Place'">{{people.place}}</td>
            </tr>
        </tbody>
    </table>
</div>

css

#myTable thead
{
    position:fixed;
}
.ScrollArea
{
    display: block;
    height: 200px;
    overflow-y: scroll;
}

Answer 1

添加单元格填充以更改表格的宽度。并将顶部/底部添加到 thead 以解决重叠问题。

Answer 2

您必须删除#myTable thead 中的position fixed

并移除 display: block;在 .scrollArea 中。