I am using extendedDataTable which has more than 100 records but the vertical Scrollbar does not appear, I changed the length and width many times with different values, but I could not resolve the problem.

what is wrong with my settings, that does not show the vertical Scrollbar?

Thanks.

here are the short part of my codes:

<h:form id="form">    

     <rich:extendedDataTable  id="table_name" value="#{customBeanTwo.approvalList}"  var="list"   style="height:300px; width:500px;"  selectionMode="none">

   <f:facet name="noData">

                Nothing found

        </f:facet>

   <f:facet name="header">

   <h:panelGroup>

     <table border="0"><tr><td style="width:400px;"><h:outputText   style="font-size: 13px;padding: 4px;" value="Requestee" /></td><td style="width:500px;"> <h:outputText  style="font-size: 13px;padding: 4px;" value="Access Request" />    </td></tr></table>        

     </h:panelGroup>

        </f:facet>

     <rich:column>

  <f:facet name="header">

                  <h:outputText value="Decision"/>

          </f:facet>

                 <div style='float:left;width:20px;height:20px' class='approveRadio imageRadio' onclick="toggleButtons(this);"> </div>

          <div style='margin-left:21px;width:20px;height:20px' class='revokeRadio imageRadio' onclick="toggleButtons(this);"> </div>

  </rich:column>

  <rich:column filterValue="#{workItemFilteringBean.itemFilter}"

                 filterExpression="#{fn:containsIgnoreCase(list.workItemNumber, workItemFilteringBean.itemFilter)}"

                         filterType="custom">

                <f:facet name="header">

                    <h:panelGroup>

                     <h:outputText value="WorkItem "/> 

                     <h:inputText value="#{workItemFilteringBean.itemFilter}" label="Workitem Filter">

                            <a4j:ajax event="blur" render="table_name" execute="@this"/>

                        </h:inputText>

                    </h:panelGroup>

                </f:facet>

                <h:outputText value="#{list.workItemNumber}" />

            </rich:column>

    <rich:column>

   <f:facet name="header">

                        <h:outputText value="Requestee Display Name" />

  </f:facet>

                    </rich:column>

                          <rich:column filterValue="#{workItemFilteringBean.requestIdFilter}"

                 filterExpression="#{fn:containsIgnoreCase(list.requestIdNumber, workItemFilteringBean.requestIdFilter)}"

                         filterType="custom">

                <f:facet name="header">

                    <h:panelGroup>

                     <h:outputText value="RequestID"/> 

                     <h:inputText value="#{workItemFilteringBean.requestIdFilter}" label="RequestID">

                            <a4j:ajax event="blur" render="table_name" execute="@this"/>

                        </h:inputText>

                    </h:panelGroup>

                </f:facet>

                <h:outputText value="#{list.requestIdNumber}" />

            </rich:column>     

            </rich:extendedDataTable> 

  </h:form>