2 Replies Latest reply on Sep 17, 2010 7:44 AM by Vishal Agarwal

    rich panel with scroll

    krikor herlopian Newbie

      <rich:layout  >
               <rich:layoutPanel width="55%" position="left">
                              
                                   <rich:panel id="firstpanel">

       

                                    <rich:tree>

                               </rich:tree>

                          </rich:panel>

           </rich:layoutpanel>

            <rich:layoutPanel width="45%" position="center">
                              
                                   <rich:panel id="secondpanel">

       

                                  /// output text and stuff

                               </rich:panel>

              </rich:layoutpanel>

      </rich:layout>

       

       

      I have this kind of form. I want to add a scroll do the first layoutpanel. When the tree is expanded the scroll to appear inside the first panel above

      I dont want to the scroll to appear in the whole page.

      The reason i want to get this working, because i dont want second panel to disappear from the users view.

        • 1. Re: rich panel with scroll
          krikor herlopian Newbie

          I worked it out this way.

          .rich-panel

                  {

                  height:85%;

                  width:100%;

                  overflow:auto;

                  }

           

           

           

          However it only works in mozzilla but not IE. In Ie I NEED TO Identify the width height by pixels for it to work.But I want to specify it by % , anyone has idea for this problem?    

          • 2. Re: rich panel with scroll
            Vishal Agarwal Newbie

            You can do it like:

             

            <style type="text/css">
              .body3 {
               height: 100px;
               overflow: auto;
              }
            </style>

             

            <rich:panel bodyClass="body3" style="width:200px;">
                <f:facet name="header">
                 Scrolling regular Panel
                </f:facet>
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
                Long Text Long Text Long Text
               </rich:panel>