же расстояние текстовых элементов с помощью CSS/JSF-2

Question

Вы можете видеть, что расстояние bewteen адреса электронной почты и адрес электронной почты равно расстояние члена, так как и дату.

Мой код для этого (с использованием JSF-2):

<h:outputText value="email" /> 
    <p:spacer width="50" height="10" /> 
    <h:outputText value="sasdrftg@rfghre.de" /> 
    <br></br> 
    <h:outputText value="member since" /> 

    <p:spacer width="50" height="10" /> 
    <h:outputText value="#{userUtilityBean.user.registered.time}"> 
     <f:convertDateTime type="both" dateStyle="short" /> 
    </h:outputText> 

Мой CSS прост:

.form-userdata { 
position: absolute; 
left: 30% !important; 
color: blue !important; 

}

Как выровнять электронную почту к «x- положение "даты?

Answer 1

Для такого рода представления информации, используйте h:panelGrid вместо

<h:panelGrid columns="2"> 
    <h:outputText value="email" /> 
    <h:outputText value="sasdrftg@rfghre.de" /> 

    <h:outputText value="member since" /> 
    <h:outputText value="#{userUtilityBean.user.registered.time}"> 
     <f:convertDateTime type="both" dateStyle="short" /> 
    </h:outputText> 
</h:panelGrid>