I am trying to set the column widths of my data table. I have looked at this question for an answer How to set width of a p:column in a p:dataTable in PrimeFaces 3.0?.
我正在尝试设置数据表的列宽。我看了这个问题,想知道如何在PrimeFaces 3.0中设置p:列的宽度。
I am however trying to do something a little bit different. I only want the column to be as wide as the widest element it it is displaying. Most of my data is text.
然而,我正在尝试做一些有点不同的事情。我只希望列的宽度和它显示的最宽的元素一样宽。我的大部分数据是文本。
So for example, it should not look like this
例如,它不应该是这样的
----------------------------- | This is some text | -----------------------------
It should look like this
它应该是这样的
--------------------- | This is some text | ---------------------
If there are multiple rows, the coulmn should be as large as the widest element.
如果有多行,库仑应该和最宽的元素一样大。
3 个解决方案
#1
37
I always use
我总是用
<p:dataTable ........ tableStyle="width:auto">
And does what I think you expect your datatable to do.
并做我认为您期望您的datatable做的事情。
#2
29
If you want the table width remain 100%, use
如果您希望表的宽度保持为100%,请使用
tableStyle="table-layout: auto;"
#3
0
Maco's answer works like a charm. However, for those whose data columns and headers become unaligned, one solution is to add a style to each <p:column>
with the desired min-width
attribute (note it has to be the same for all <p:column>
of the <p:dataTable>
). It might be more practical to define a style class in your css and refer to it using styleClass attribute in <p:column>
. In that way, if you decide to change the minimum width, you would only have to change it in one place.
Maco的回答很有魅力。但是,对于那些数据列和标头不对齐的用户,一个解决方案是将一个样式添加到每个
<p:column style="min-width: 100px;">
...
</p:column>
Tested in PF 5.3
测试在PF 5.3
#1
37
I always use
我总是用
<p:dataTable ........ tableStyle="width:auto">
And does what I think you expect your datatable to do.
并做我认为您期望您的datatable做的事情。
#2
29
If you want the table width remain 100%, use
如果您希望表的宽度保持为100%,请使用
tableStyle="table-layout: auto;"
#3
0
Maco's answer works like a charm. However, for those whose data columns and headers become unaligned, one solution is to add a style to each <p:column>
with the desired min-width
attribute (note it has to be the same for all <p:column>
of the <p:dataTable>
). It might be more practical to define a style class in your css and refer to it using styleClass attribute in <p:column>
. In that way, if you decide to change the minimum width, you would only have to change it in one place.
Maco的回答很有魅力。但是,对于那些数据列和标头不对齐的用户,一个解决方案是将一个样式添加到每个
<p:column style="min-width: 100px;">
...
</p:column>
Tested in PF 5.3
测试在PF 5.3