Pessoal, estou com dificuldade de alinhar os componentes na tela conforme a imagem,
tenho o seguintes componentes abaixo.
Alguem pode me dar uma dica ???
<p:panel style="left:700px; width:500px;height:509px">
<f:facet name="header">
<h:outputText value="#{msg.guiaconsulta_titulo}" styleClass="fontecentralizada" />
</f:facet>
<br/>
<h:panelGrid style="align: left;" columns="3" cellspacing="1" cellpadding="5" width="420" >
<h:outputText value="#{msg.guiaconsulta_prestador}" styleClass="fonte"/>
<p:inputText id="txtprestador" value="#{cadguiaMbean.vuser_autentica}" style="width: 50px;" readonly="true"/>
<p:inputText id="txtprestador22" value="#{cadguiaMbean.vnomeprestador}" style="width: 220px;" readonly="true"/>
</h:panelGrid>
<h:panelGrid style="align: left;" columns="4" cellspacing="1" cellpadding="5" width="445" >
<h:outputText value="#{msg.guiaconsulta_emissaoData}" styleClass="fonte"/>
<p:inputText id="txtdata" value="#{cadguiaMbean.data}" style="width: 130px;" readonly="true"/>
<h:outputText value="#{msg.guiaconsulta_emissaoHora}" styleClass="fonte"/>
<p:inputText id="txthora" value="#{cadguiaMbean.hora}" style="width: 70px;" readonly="true"/>
</h:panelGrid>
<h:panelGrid style="align: left;" columns="3" cellspacing="1" cellpadding="5" width="440" >
<h:outputText value="#{msg.guiaconsulta_nome}" styleClass="fonte"/>
<p:inputText id="txtnome" style="width: 105px;" maxlength="17"/>
<p:commandLink immediate="true" action="#{cadguiaMbean.carregagridcadprest}">
<p:graphicImage value="../resources/images/buscar.png" onclick="beneficiario.show();"/>
</p:commandLink>
</h:panelGrid>
<h:panelGrid style="align: left;" columns="2" cellspacing="1" cellpadding="5" width="440" >
<h:outputText value="#{msg.guiaconsulta_Datanasc}" styleClass="fonte"/>
<p:inputText id="txtDtnascimento" style="width: 100px;" />
</h:panelGrid>