IE 无法正确呈现primeng p-table

Question

我有一个primeng p表组件。 该表格在 Chrome 和 Firefox 中显示良好，但在 IE 中仅跨越大约一半的页面。

我只是包含了没有内容的 p-table 元素。

<p-card>
<p-table #subsTable
           [value]="subs"
           sortMode="multiple"
           selectionMode="single"
           (onRowSelect)="onRowSelect($event)"
           (onRowUnselect)="onRowUnselect($event)"
           [(selection)]="selectedSub"
           [columns]="columns"
           dataKey="subId"
           [paginator]="subs.length > 0"
           (onPage)="onPageChange($event)"
           [rows]="5"
           >
    </p-table>
    </p-card>

css：

.ui-table table {
    table-layout: auto !important;
}

问题是table-layout: fixed; 是从.ui-table table css 块上的 primeng 继承的。 如您所见，我尝试用我自己的 css 覆盖它，但这没有用。 我还在npm install --save classlist.js运行了 3 个 npm 命令（ npm install --save classlist.js 、 npm install --save web-animations-js和npm install --save intl ）。

我该如何覆盖/修复这个问题？

Answer 1

尝试这个：

::ng-deep .ui-table table {
    table-layout: auto;
}

Answer 2

这将解决它

const trs = this.element.nativeElement.querySelectorAll(".ui-table-scrollable-body-table tbody tr");
        
        if (trs && trs.length) {
          const tr = trs[0];
          const tds = tr.querySelectorAll("td")
          if (tds && tds.length) {
            tds[tds.length - 1].style.width = "101%";
            setTimeout(function () {
              tds[tds.length - 1].style.width = "100%";
            }, 10)
          }
        }
      }, 50);