How to set width of a p:column in a p:dataTable in PrimeFaces 3.0?

Question

I\'m using PrimeFaces 3.0-M3 and I have a with two columns in it. I want the first column to be fixed at a width of 20px. The other column c

Answer 1

This worked for me

<p:column headerText="name" style="width:20px;"/>

Answer 2

Addition to @BalusC 's answer. You also need to set width of headers. In my case, below css can only apply to my table's column width.

.myTable td:nth-child(1),.myTable th:nth-child(1) {
   width: 20px;
}

Answer 3

In PrimeFaces 3.0, that style get applied on the generated inner <div> of the table cell, not on the <td> as you (and I) would expect. The following example should work out for you:

<p:dataTable styleClass="myTable">

with

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

In PrimeFaces 3.5 and above, it should work exactly the way you coded and expected.

Answer 4

Inline styling would work in any case

  <p-column field="Quantity" header="Qté" [style]="{'width':'48px'}">

Answer 5

I don't know what browser you're using, but according to w3schools.com, nth-child and nth-last-child do now work on MSIE 8. I don't know about 9. http://www.w3schools.com/cssref/pr_border-style.asp will give you more info.

Answer 6

For some reason, this was not working

<p:column headerText="" width="25px" sortBy="#{row.key}">

But this worked:

<p:column headerText="" width="25" sortBy="#{row.key}">