SelectOneMenu宽度无法使用bootstrap工作

Question

我正在使用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"

时才有效

我已经尝试过添加数据宽度，但它也无法正常工作。有什么提示吗？

Answer 1

selectpicker应该有自己的css属性集，这会阻止应用宽度样式。可以粘贴selectpicker中设置的属性。

Answer 2

在inspect元素中查找h：selectOneMenu组件的css类，并在自定义css文件中覆盖它。

例如

.selectOneMenuClassName{
    width:280px !important;
}

找到合适的班级名称。

Answer 3

目前尚不清楚selectpicker css类内部是什么。为了使它工作，首先selectpicker应该是css类，其次应该没有css错误。但是如果你想改变页面上所有selectonemenu的宽度，如果还需要任何人，这可能会有所帮助！

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

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

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