Youcef Laidani Youcef Laidani - 1 month ago 15
CSS Question

DataTable PrimeFaces columns width not changes

Is there any way to specifie the same

width
of columns in datatable, for example this part of my
dataTable
, but the width is not equal for all the columns :

<p:dataTable value="" styleClass="hide-content-names">
<p:columns value="#{managedBean.listObject}"
var="head" headerText="#{head.code}" width="20px;"/>
</p:dataTable>


Width of columns

Is there any solution for that?

Thank you.

Answer

The best way to do this is to write some custom CSS. If you don't want to apply this to all your data tables add a class to your data table, let's say my-table.

By default PrimeFaces data tables are set to width: 100%. Override that first to auto:

.my-table.ui-datatable table { width: auto; }

Now, instead of width, set the max-width to 20px for both th and td in your table:

.my-table.ui-datatable th, .my-table.ui-datatable td { max-width: 20px; }

Using the style attribute on your column for this will also work.