html - 如何在 h:panelgrid 中的两个特定列之间留出空格

Question

<h:panelGrid columns="4">
<f:facet name="header">
 <h:outputText value="Customer   Information"/>
</f:facet>


<h:outputLabel value="Title" /><h:outputText  value="#{addProductBean.title}"/>

<h:outputLabel style="width: 80px" value="Date of Birth" />
<h:outputText   id="dateofbirth" value="#{addProductBean.dateOfBirth}" size="10"  maxlength="100"/>


<h:outputLabel value="First Name" /><h:outputText id="firstname" value="#  {addProductBean.firstName}" size="10" maxlength="100"/>

<h:outputLabel value="Gender" /><h:outputText id="gender" value="#{addProductBean.gender}" size="10" maxlength="100"/>

<h:outputLabel value="Last Name" /><h:outputText id="lastname" value="#{addProductBean.lastName}" size="10" maxlength="100"/>

</h:panelGrid>

在上面我希望标题 dateofbirth 和其他类似字段之间有一个空格是可能的。

Answer 1

您可以使用 columnClasses 为每列定义样式

<h:panelGrid columns="4" columnClasses="a,b,c,d">

    .a{
        width:80px;
     }
     .....