如何在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; 
    } 
    .....