css - 更改 p 列宽度

Question

我在一个元素中需要使用 PrimeNG 来制作表格，但我在定义第一列的宽度时遇到了问题。

在我的 HTML 代码中，我有类似的内容:

<p-datatable styleClass="myTable">
     <p-column>

     </p-column>
     ...
</p-datable>

在我的 CSS 中，我有类似的东西:

.myTable td:nth-child(1) {
    width:300px;
}

此外，我尝试使用以下 HTML:

 <p-datatable>
     <p-column styleClass="col1">

     </p-column>
     ...
 </p-datable>

在我的 CSS 中:

td.col1 {
    width: 300px;
}

我也确实检查了代码，看到了 tr.ui-widget-content ui-datatable-even 行的类，并尝试了以下 CSS:

tr.ui-widget-content ui-datatable-even td:nth-child(1) {
    width: 500px !important;
}

似乎没有任何效果。

谁能告诉我是否可以定义列的宽度，如果可以，我该怎么做？

Answer 1

你可以手动定义宽度，试试这个:

<p-column [style]="{'width':'300px'}" </p-column>