修復p：PrimeFaces中的數據表寬度

我正在使用PrimeFaces 3.2的<p:dataTable> </p:dataTable>。

我該如何修復PrimeFace的DataTable寬度與CSS？

我已經嘗試過

style="table-layout: fixed; width:100px;"

但它不工作

添加的數據表

<p:dataTable id="eventTbl" var="e" value="#{eventBean.eventList}" style="table-layout: fixed; width:100px;" 
    paginator="true" rows="20" lazy="true" 
    paginatorTemplate=" {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}" 
    dynamic="true"> 
    <p:column> 
     <p:commandButton id="selectButton" update=":form:display" 
      action="#{eventBean.getEventDetails(e.eventNum)}" 
      oncomplete="eventDialog.show()" icon="ui-icon-search" 
      title="View"> 
     </p:commandButton> 
    </p:column> 
    <p:column headerText="Event Type" filterBy="#{e.eventType}"> 
     <h:outputText value="#{e.eventType}" /> 
    </p:column> 
    <p:column headerText="Order Id" filterBy="#{e.orderId}"> 
     <h:outputText value="#{e.orderId}" /> 
    </p:column> 
    <p:column headerText="Status" filterBy="#{tr.status}"> 
     <h:outputText value="#{tr.status}" /> 
    </p:column> 
    <p:column headerText="Event Date" filterBy="#{e.eventDate}"> 
     <h:outputText value="#{e.eventDate}" /> 
    </p:column> 
    <p:column headerText="Event Number" filterBy="#{e.eventNum}"> 
     <h:outputText value="#{e.eventNum}" /> 
    </p:column> 
    <p:column headerText="Request Number" filterBy="#{e.requestNum}"> 
     <h:outputText value="#{e.requestNum}" /> 
    </p:column> 
    <p:column headerText="Masked Pan" filterBy="#{e.maskedPan}"> 
     <h:outputText value="#{e.maskedPan}" /> 
    </p:column> 
    <p:column headerText="Card Name" filterBy="#{e.cardName}"> 
     <h:outputText value="#{e.cardName}" /> 
    </p:column> 
    <p:column headerText="Reference Number" filterBy="#{e.refNumb}"> 
     <h:outputText value="#{e.refNumb}" /> 
    </p:column> 
</p:dataTable>

來源

2013-02-19 mariami

通常應與風格=工作「寬度：100像素;」。你能發佈整個p：dataTable的代碼嗎？也許你有一些彩色的寬度也大於表格寬度？ – mooonli 2013-02-19 08:51:43

在此添加完整代碼。 – Sajmon 2013-02-19 08:53:21

@marcbaur，sajmon_d 謝謝，我已經添加了完整的代碼 – mariami 2013-02-19 08:58:14

完整的代碼我敢肯定你有一定的最小寬度或輸入和按鈕表單元素的樣式類的寬度屬性。

檢查與螢火蟲（選擇其中一個輸入字段，並檢查附加到它的樣式的最小寬度或寬度屬性）。

如果你有任何這些，嘗試刪除或調整它們，因爲它們的寬度將被應用，不管你爲它們的父（表）元素設置了什麼寬度。

映入眼簾，而不是風格馬克

來源

2013-02-19 09:19:05 mooonli

我刪除了所有的輸入，但仍然無法用css調節數據表的寬度 – mariami 2013-02-19 10:18:22

你能發佈新的文件內容嗎？ – mooonli 2013-02-19 10:41:14

使用TABLESTYLE。

來源

2013-02-19 09:33:41

我用過，但它仍然沒有生效 – mariami 2013-02-19 10:17:43

可能有兩種可能的方法來解決或發現此問題。

請檢查您是否使用過colspan size作爲datatable。例如，如果您的表單colspan大小爲10，請確保您在數據表中提到了colspan大小爲10。
使用的styleClass代替風格或繼承的值作爲像下面

.tableSize{ table-layout:fixed !important; width:100% !important; }

使用的styleClass = 「tableSize」

來源

2017-08-21 06:01:58

修復p：PrimeFaces中的數據表寬度

回答

相關問題