2014-05-20 41 views
0

大家好我是尋找辦法有一個網頁喜歡這幅畫the hope對齊panelGrid的是在另一個panelGrid的

沒有橫幅(只有部分之後) 我已經測試了所有有關的問題風格垂直對齊,頂部,這樣的東西,並沒有爲我工作,如果任何人有任何解決方案將是馬麗娟,並感謝您

這該怎麼我的網頁看起來像實際(代碼)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:p="http://primefaces.org/ui"> 

<h:head> 
<style> 
.className td{ 
    vertical-align: top; 
} 
</style> 
<style> 
.panelGridCenter { 
    margin: 0 auto; 
} 
</style> 
</h:head> 
<body> 

    <ui:repeat var="offre" value="#{offreBean.offres}" varStatus="status"> 
     <h:link id="offre" value="#{offre.profilPrincipal}" 
      fragment="#{offre.id}" /> 
     <br></br> 
    </ui:repeat> 
    <p:panelGrid columns="2" styleClass="classeName" style="display:block" > 
     <ui:repeat var="offre" value="#{offreBean.offres}" varStatus="status"> 

      <span id="#{offre.id}"> 


      <h:panelGrid columns="2" 
        style="width:600px" > 

        <h:outputLabel value="Profil Principal : " /> 
        <h:outputText value="#{offre.profilPrincipal}" /> 
        <h:outputLabel value="Mission : " /> 
        <h:outputText value="#{offre.mission}" /> 
        <h:outputLabel value="Profil : " /> 
        <h:outputText value="#{offre.profil}" /> 
        <h:outputLabel value="Specificite du Poste : " /> 
        <h:outputText value="#{offre.speceificitePoste}" /> 
        <h:outputLabel value="Niveau Etude : " /> 
        <h:outputText value="#{offre.niveauEtude}" /> 
        <h:outputLabel value="Experience Mini : " /> 
        <h:outputText value="#{offre.niveauExperienceMin}" /> 
        <br></br> 

       </h:panelGrid> 


      </span> 
     </ui:repeat> 
     <h:panelGrid columns="2" > 
      <h:outputLabel value="Profil Principal" /> 
      <h:inputText value="#{offreBean.profil}" /> 
      <h:outputLabel value="Contrat" /> 
      <p:selectOneMenu value="#{offreBean.offres}" 
       converter="ContratConverter"> 
       <f:selectItem itemLabel="Choisir Contrat :" /> 
       <f:selectItems value="#{offreBean.contrats}" var="contrat" 
        itemValue="#{contrat}" itemLabel="#{contrat.contrat}" /> 
      </p:selectOneMenu> 
      <h:outputLabel value="Categorie" /> 
      <p:selectOneMenu value="#{offreBean.categorieoffres}" 
       converter="CategorieConverter"> 
       <f:selectItem itemLabel="Choisir Categorie :" /> 
       <f:selectItems value="#{offreBean.categorieoffres}" var="categorie" 
        itemValue="#{categorie}" itemLabel="#{categorie.categorie}" /> 
      </p:selectOneMenu> 
      <h:outputLabel value="Mots Clés" /> 
      <h:inputText value="#{offreBean.motclé}" /> 

      <p:commandButton value="Chercher" /> 
     </h:panelGrid> 
    </p:panelGrid> 
</body> 
</html> 
+0

你參加在[成分]一個loook(http://www.primefaces.org/showcase/ui/panel/layout/full.xhtml)? – QueryLars

+0

是的,但我必須只使用panelgrid和風格,以我想要的形式 – ClubberBen

+0

檢查生成的HTML並詢問如何使用提供的HTML和CSS實現它。 –

回答

0

第一加t他:

<h:head> 
     <style> 
    .className td { 
     vertical-align: top; 
    } 
    </style> 
</head> 

<h:panelGrid columns="2" id="container" styleClass="className" 
     style="display:block;"> 

,乾淨的tomcat工作目錄,清理瀏覽器緩存和它的工作像一個風情萬種!!!!