4 Replies Latest reply on Apr 28, 2008 7:55 AM by leelavathic leelavathic

    Scrollbar for rich:panel when width is in percentage

    leelavathic leelavathic Novice

      I have a h:panel grid with following data:
      <h:panelGrid columns="2" styleClass="widthClass" columnClasses="col1,col2" >

      .col1{
      vertical-align:top;
      height:100%;
      width:30%;
      }
      .col2{
      vertical-align:top;
      height:100%;
      width:70%;
      }
      .widthClass{
      width:100%;
      }

      In the Col1(left column) I'm displaying a rich tree component and in the Col2(right column) I'm displaying data related to the component selected in the Col1.

      Inside the Col1 I'm using a rich:panel to display data
      <rich:panel styleClass="treeClass" >
      .treeClass{
      height:510px;
      overflow:auto;
      width:220px;
      }

      The problem that I face is if the screen(Monitor) is quite big then the scrollbar is coming only for a part of the Col1(left column):

      |<---------Col1---------------------->|<------------Col2-------------->|
      (***********)************|*************************
      |<--Scrollbar-->|

      I think since in a bigger screen 220px for rich:panel is smaller than 30% of Col1. But I need the scrollbar to be displayed inline with Col1 ie,

      |<---------Col1---------------------->|<------------Col2-------------->|
      (*************************)|************************
      |<-----------Scrollbar--------------->|

      Can anyone suggest a solution for this problem.

      Thanx in advance.