4 Replies Latest reply on Nov 28, 2008 1:02 PM by Michael Angelo

    rich panel header disappears and content runs beyond bottom

    Michael Angelo Newbie

      I took some of the pages generated by JBoss Developer Studio Seam application generator.

      I wanted to split a page and have 2 panels of content side-by-side. When I group the content with rich:panel tags odd behavior occurs. First, the content appears to extend past the bottom border of the panel. Second, if you add the as the last entry of the rich:panel the content no longer runs past the bottom border, but the header disappears!!

      I never thought this would be this difficult. Here is some of the code:


       <rich:panel style="padding:0">
       <f:facet name="header">
       <rich:spacer height="4" />
       </f:facet>
      
       <h:panelGrid columns="2" columnClasses="panels2">
      
       <rich:panel>
       <f:facet name="header">
       <h:outputText value="Customer"/>
       </f:facet>
      
       <s:decorate id="company" template="layout/display.xhtml">
       <ui:define name="label">Company:</ui:define>
       #{customerHome.instance.company}
       </s:decorate>
      
       <s:decorate id="lastName" template="layout/display.xhtml">
       <ui:define name="label">Last Name:</ui:define>
       #{customerHome.instance.lastName}
       </s:decorate>
      
       <s:decorate id="firstName" template="layout/display.xhtml">
       <ui:define name="label">First Name:</ui:define>
       #{customerHome.instance.firstName}
       </s:decorate>
      
       <s:decorate id="address" template="layout/display.xhtml">
       <ui:define name="label">Address:</ui:define>
       #{customerHome.instance.address}
       </s:decorate>
      
       <s:decorate id="city" template="layout/display.xhtml">
       <ui:define name="label">City:</ui:define>
       #{customerHome.instance.city}
       </s:decorate>
      
       <s:decorate id="state" template="layout/display.xhtml">
       <ui:define name="label">State:</ui:define>
       #{customerHome.instance.state}
       </s:decorate>
      
       <s:decorate id="zipCode" template="layout/display.xhtml">
       <ui:define name="label">Zip Code:</ui:define>
       #{customerHome.instance.zipCode}
       </s:decorate>
      
       <s:decorate id="county" template="layout/display.xhtml">
       <ui:define name="label">County:</ui:define>
       #{customerHome.instance.county}
       </s:decorate>
      
       </rich:panel>
      
       <rich:panel>
      
       <f:facet name="header">Billing</f:facet>
      
       <s:decorate id="billingAddress" template="layout/display.xhtml">
       <ui:define name="label">Address:</ui:define>
       #{customerHome.instance.billingAddress}
       </s:decorate>
      
       <s:decorate id="billingCity" template="layout/display.xhtml">
       <ui:define name="label">City:</ui:define>
       #{customerHome.instance.billingCity}
       </s:decorate>
      
       <s:decorate id="billingState" template="layout/display.xhtml">
       <ui:define name="label">State:</ui:define>
       #{customerHome.instance.billingState}
       </s:decorate>
      
       <s:decorate id="billingZipCode" template="layout/display.xhtml">
       <ui:define name="label">Zip Code:</ui:define>
       #{customerHome.instance.billingZipCode}
       </s:decorate>
      
       <s:decorate id="cashOnly" template="layout/display.xhtml">
       <ui:define name="label">Cash Only:</ui:define>
       #{customerHome.instance.cashOnly}
       </s:decorate>
      
       <s:decorate id="phone" template="layout/display.xhtml">
       <ui:define name="label">Phone:</ui:define>
       #{customerHome.instance.phone}
       </s:decorate>
      
       <s:decorate id="fax" template="layout/display.xhtml">
       <ui:define name="label">Fax:</ui:define>
       #{customerHome.instance.fax}
       </s:decorate>
      
       <s:decorate id="township" template="layout/display.xhtml">
       <ui:define name="label">Township:</ui:define>
       #{customerHome.instance.township}
       </s:decorate>
      
       <s:decorate id="altPhone" template="layout/display.xhtml">
       <ui:define name="label">Alt Phone:</ui:define>
       #{customerHome.instance.altPhone}
       </s:decorate>
      
       <s:decorate id="cellPhone" template="layout/display.xhtml">
       <ui:define name="label">Cell Phone:</ui:define>
       #{customerHome.instance.cellPhone}
       </s:decorate>
      
       <s:decorate id="pager" template="layout/display.xhtml">
       <ui:define name="label">Pager:</ui:define>
       #{customerHome.instance.pager}
       </s:decorate>
      
      
       </rich:panel>
      
       </h:panelGrid>
      
       </rich:panel>