css - 如何对齐 p :selectOneMenu 内的组件

Question

我正在尝试使 PrimeFaces SelectOneMenu 的“组件”右对齐以适应表单的一般外观。

它适用于 selectItems，但所选元素有某种偏移量除了硬编码 px 中的位置之外，还有什么方法可以解决这个问题吗？

下面是表格中一行的代码以及我添加的用于使值正确对齐的 css通过添加 css，值实际上与 SelectOneMenu 的右侧对齐，但就像您在图片中看到的那样，所选值在右侧有很大的边距

<p:column style="vertical-align:top;padding-top:8px">
    <p:panelGrid id="tdkDetailsPanel" styleClass="hardwareDetailsPanel" columns="2">
<h:outputLabel value="Item: " />
<p:selectOneMenu value="#{backingBean.selectedItemId}">
  <f:selectItems value="#{backingBean.availableItemIds}" />
  <p:ajax update="itemDetailsPanel" />
</p:selectOneMenu>
<!-- more of the same -->
</p:panelGrid>
</p:column>

---

.ui-selectonemenu {
    width: 100% !important;
    text-align: right !important;
}

.ui-selectonemenu-panel {
    text-align: right !important;
}

.ui-selectonemenu-list-item {
    text-align: right !important;
}

.ui-selectonemenu-label {
    text-align: right !important;
}

Answer 1

我用

解决了我的问题

<h:selectonemenu>

代替

<p:selectonemenu>

为此添加文本对齐属性给了我想要的结果