Css p:selectOneMenu大纲嵌套在p:panel中时会获得额外空间

Css p:selectOneMenu大纲嵌套在p:panel中时会获得额外空间,css,jsf,jsf-2,primefaces,Css,Jsf,Jsf 2,Primefaces,我使用的是PrimeFaces 5.2,在p:panel中有一个p:selectOneMenu。如果selectOneMenu位于面板外部,则问题不会持续存在,但在面板内部时,问题如下所示: 您可以在selectOne菜单的右侧看到失真 我尝试了一些CSS编辑,但似乎没有帮助: .ui-selectonemenu-panel{ width: 150px; } .ui-selectonemenu-panel .ui-selectonemenu-items-wrapper{ ove

我使用的是PrimeFaces 5.2,在
p:panel
中有一个
p:selectOneMenu
。如果
selectOneMenu
位于面板外部,则问题不会持续存在,但在面板内部时,问题如下所示:

您可以在
selectOne菜单的右侧看到失真

我尝试了一些CSS编辑,但似乎没有帮助:

.ui-selectonemenu-panel{
    width: 150px;
}
.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper{
    overflow-x: hidden;
}
.ui selectonemenu panel
中将width设置为150px仅帮助恢复下拉菜单的大小,而不是扭曲的零件本身

更改xhtml文件中的
selectOneMenu
width并不能解决此问题。我使用的主题是一个名为“bootstrap”的PrimeFaces主题,但是调整主题的大小也不起作用。我没有尝试不同的主题,因为我想继续使用这个主题

这是
selectOneMenu
的外观:


我在网上找不到任何类似的问题。非常感谢您的帮助。

多亏了Geinmachi的评论,我才明白这一点。更改
ui-selectone菜单标签似乎有效

最初,我的
selectOneMenu
的宽度为150px,我在CSS文件中编辑了
ui selectOneMenu标签

.ui-selectonemenu-label{
    width: 80px !important;
}
我的每一个
selectOneMenu
s开始像这样:

您可以在右侧看到由收缩标签引起的灰色区域。当我将宽度设为200px时,它看起来是这样的:

但当我将标签宽度设置为150px时,我观察到的额外空间与问题中所示的相同。所以我试着将它设置为120px,它看起来是固定的。我认为右侧的灰色下拉按钮的宽度约为30px,因此设置标签宽度时,不考虑30px的差异会导致超出
selectOneMenu
的额外空间


然而,我仍然不知道为什么只有当
selectOneMenu
嵌套在面板中时才会出现额外的空间。

多亏了Geinmachi的评论,我才明白这一点。更改
ui-selectone菜单标签似乎有效

最初,我的
selectOneMenu
的宽度为150px,我在CSS文件中编辑了
ui selectOneMenu标签

.ui-selectonemenu-label{
    width: 80px !important;
}
我的每一个
selectOneMenu
s开始像这样:

您可以在右侧看到由收缩标签引起的灰色区域。当我将宽度设为200px时,它看起来是这样的:

但当我将标签宽度设置为150px时,我观察到的额外空间与问题中所示的相同。所以我试着将它设置为120px,它看起来是固定的。我认为右侧的灰色下拉按钮的宽度约为30px,因此设置标签宽度时,不考虑30px的差异会导致超出
selectOneMenu
的额外空间


但是,我仍然不知道为什么只有当
selectOneMenu
嵌套在面板中时才会出现额外的空间。

无法使用默认主题复制,但可以尝试更改以下类的宽度:
ui-selectOneMenu-label
ui-selectOneMenu
@Geinmachi感谢您的有用评论,有关更多详细信息,请参阅我的答案。无法使用默认主题复制,但请尝试更改以下类的宽度:
ui-selectonemenu-label
ui-selectonemenu
@Geinmachi感谢您的有用评论,有关更多详细信息,请参阅我的答案。“然而,我仍然不知道为什么只有当selectOneMenu嵌套在面板中时才会出现额外的空间。“使用浏览器开发人员工具查看与默认值相比应用了哪些类/样式。@Kukeltje有一个
ui面板
类应用于面板,默认情况下它应用了
填充:0.2em
值。然而,我仍然不知道为什么只有当selectOneMenu嵌套在面板中时才会出现额外的空间使用浏览器开发人员工具查看与默认值相比应用了哪些类/样式。@Kukeltje有一个
ui面板
类应用于面板,默认情况下它应用了
填充:0.2em
值。我想可能是罪魁祸首。