Primefaces数据表标题对齐

Question

我有关于primefaces数据表的问题.如您所见,列边框和标题存在对齐问题.这是一个主要的错误或我的数据表有什么问题？顺便说一句,数据表有动态列.

<p:dataTable     scrollable="true" scrollWidth="100%" editable="true" editMode="cell"   
var="invoiceLine" value="#{myController.invoiceLines}"                          
                         selection="#{myController.selectedInvoiceLine}" selectionMode="single" rowKey="#{invoiceLine.uuid}"
                         >
<p:columns value="#{myController.columns}" var="column"
                           styleClass="ui-editable-column" width="50"
                           columnIndexVar="colIndex">

//some stuff
</p:columns>         

            </p:dataTable>

Answer 1

做一招,

Remove scrollable = true

并创建新的样式类,

.ui-datatable-hor-scroll .ui-datatable-tablewrapper,.scrolling-div .ui-datatable-tablewrapper{
     overflow: auto;
     width: 100%;
     padding-bottom: 5px;}

适用styleClass于p:datatable喜欢styleClass="ui-datatable-hor-scroll"

Answer 2

问题在 6.2 中仍然存在。在 style 属性中设置宽度的另一种解决方案是替换

<p:column style="width:100px">

和

<p:column style="width:calc(100px)">

MDN-calc() 说明