当p：对话框调整大小时，如何调整p：pickList的大小？

Question

我有一个包含p：pickList的PF4 p：对话框。

当我调整p：对话框时，它不会调整p：picklist

的大小

我该怎么做？

Answer 1

<p:pickList>基本上呈现HTML <table>，如下所示：

<table class="ui-picklist">
    <td><ul class="ui-picklist-list">[left list]</ul></td>
    <td>[buttons]</td>
    <td><ul class="ui-picklist-list">[right list]</ul></td>
</table>

在默认的PrimeFaces CSS中，.ui-picklist-list的固定宽度为200px。

我们希望将其设为最小宽度，并使包含左右列表的表格单元格扩展到最大值（50％即可）。

总而言之，只需将这些CSS规则添加到加载after样式表文件的PrimeFaces CSS就足够了。

.ui-picklist td:first-child,
.ui-picklist td:last-child {
    width: 50%;
}
.ui-picklist .ui-picklist-list {
    width: auto;
    min-width: 200px;
}