1

我有一个包含 ap:pickList 的 PF4 p:dialog。

当我调整 p:dialog 的大小时,它不会调整 p:picklist 的大小

我该怎么做?

在此处输入图像描述

在此处输入图像描述

4

1 回答 1

2

基本上呈现如下<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 规则添加到在 PrimeFaces CSS之后加载的样式表文件就足够了。

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

在此处输入图像描述

于 2016-05-09T07:50:11.973 回答