primefaces數據表格樣式？

我想創建一個使用primefaces的表，但是我的表列的寬度與標題和正文不相等。我試圖爲每列添加style="width: inherit"或style="width: 30%"，但表格標題和表格主體之間的寬度仍然不均勻。如果不能滾動，表格會很好地一致，但我想要一個可滾動的表格。這裏是我的代碼：primefaces數據表格樣式？

<h:panelGrid columns="1" class="plan-panel" columnClasses="label, value"> 
    <h:outputText class="deploy-label" value="Table 1"/> 
    <p:dataTable var="service" value="aaaa" 
       id="service-table" scrollable="true" scrollHeight="250"> 
     <p:column headerText="Col1" width="20"> 
      <h:outputText value="test122222222222"/> 
     </p:column> 
     <p:column headerText="Col2" width="20"> 
      <h:outputText value="test255567y774"/> 
     </p:column> 
     <p:column headerText="Col3" width="20"> 
      <h:outputText value="test3433666"/> 
     </p:column> 
     <p:column headerText="Col4" width="20"> 
      <h:outputText value="test43364667"/> 
     </p:column> 
    </p:dataTable> 

</h:panelGrid>

這是表的樣子：

我不知道是否有人知道如何在此表上應用樣式，以便該表的頭和身體的寬度相等。

感謝

來源

2016-07-19 RLe

PF版本？我假設一個老的，還是你在panelgrid之外嘗試？ – Kukeltje

嗨，我的PF版本是3.5，我確實在panelgrid之外嘗試過它，但仍然不是algin，即使 – RLe

嘗試做一個簡單的width在Column例如

<p:column headerText="Col2" width="20"><h:outputText value="test122222222222"/></p:column>

我試圖改變這樣說，這和它的工作對我來說，這是真的，列香料很小但爲我工作，希望有所幫助。

來源

2016-07-20 00:54:00

有任何反饋？ –

嗨，我試過它所有的寬度= 20，但它仍然沒有很好地對齊 – RLe

我修正了代碼，現在圖片顯示瞭如何使用width = 20 – RLe

在這種情況下唯一的'好'答案是停止使用可滾動或使用較新的版本，因爲3.5是比較舊（6.0已經不存在）。這方面有很多變化/改進。

您可以嘗試修補CSS或最有可能的數據表的js，但計算和對齊動態寬度是相當繁瑣的。我懷疑有人會爲你做這件事。

有一兩件事你可以嘗試的，看看有什麼table-layout: fixed當應用到表的操作（查看源），然後也許給每列一個固定的寬度像你這樣也許通過CSS

來源

2016-07-20 16:43:10 Kukeltje

嗨，我在哪裏可以找到更多的信息'table-layout：fixed'？ – RLe

谷歌？像這樣：https://www.google.com/search?q=table-layout%3A+fixed – Kukeltje

primefaces數據表格樣式？

回答

相關問題