【问题标题】:SelectOneMenu width not working using bootstrapSelectOneMenu 宽度无法使用引导程序工作
【发布时间】:2025-12-09 06:20:03
【问题描述】:

我正在使用 selectOneMenu JSF 2 并尝试更改它的宽度不起作用。

`<h:selectOneMenu style="width:280px" styleClass="selectpicker"`>
            <f:selectItem itemValue="1" itemLabel="A" />
            <f:selectItem itemValue="2" itemLabel="B" />
            <f:selectItem itemValue="3" itemLabel="C " />
        </h:selectOneMenu>`

仅当我删除 styleClass = "selectpicker" 时才有效

我已经尝试添加数据宽度,它也没有工作。有什么建议吗?

【问题讨论】:

  • 大家好,有什么建议吗???
  • @Kukeltje,我没看懂你的转贴,你是来教我如何在论坛发帖还是解惑?

标签: css twitter-bootstrap jsf jsf-2


【解决方案1】:

selectpicker 应该有自己的 css 属性集,这会阻止应用宽度样式。你能把设置的属性粘贴到selectpicker里面吗?

【讨论】:

  • 嗨 Ragu,你会如何在选择器中放入?已经添加:“data-width”,“style="width:",不起作用。
  • class styleClass="selectpicker"`上写的css是什么。如果在此 selectpicker css 类中设置了宽度,那么您需要检查如何覆盖,如 stakahop 指出的那样。
【解决方案2】:

在检查元素中找到 h:selectOneMenu 组件的 css 类,并在您的自定义 css 文件中覆盖它。

例如。

.selectOneMenuClassName{
    width:280px !important;
}

只要找到一个正确的类名。

【讨论】:

    【解决方案3】:

    目前尚不清楚 selectpicker css 类中的内容。为了使它工作,首先 selectpicker 应该是 css 类,其次它里面应该没有 css 错误。但是,如果您想更改页面上所有 selectonemenu 的宽度,如果有人仍然需要,这可能会有所帮助!

    .ui-selectonemenu{
      width: 280px !important;
    }
    
    .ui-selectonemenu-label{
      width: 280px !important;
    }
    
    .ui-selectonemenu-panel {
      width:280px !important;
    }
    

    【讨论】:

    • 问题是关于 h:selectOneMenu 而不是 PrimeFaces。