桌子主体，头部重叠和桌子的宽度没有扩大

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

您必须删除#myTable thead

中的固定位置

并删除display：block;在.scrollArea。

Answer 2

添加cellpadding以更改表格的宽度。并向thead添加顶部/底部以解决重叠。