adding vertical scroll bar for the table in css

**Brake Fail** · 29-06-2009

Hi,

I want to have a vertical scroll to mt table which fetch values from my database.
I want to fix the height of the table & then navigate it with the scroll.
If you can help me with the scroll that will be very helpful.

help me with the vertical scroll bar for the table in css.

**afidelino** · 29-06-2009

Try this:

Code:

#main
{
width:100%;
height:100%;
overflow:auto;
}

<td width="100%">
<div id="main">
<table width="99%" border="0">
<tr>
<td width="97%" valign="top">
text
</td>
</tr>
</table>
</div>
</td>

**Rover** · 29-06-2009

I tend to go with a containing div:

Code:

div.scroll {
  overflow:auto;
  padding-right:6px;
}

You'll need to add a height attribute somewhere for this to work! I usually have a default set in the div.scroll declaration in html

Code:

<div class="scroll" >
  <table>
  <!-- your table stuff in here -->
  </table>
</div>

**RasMus** · 29-06-2009

You can not with TABLE Element, You do can with DIV

<div style="overflow: scroll/auto/hidden;"></div>

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body bgcolor="#777770" text="#ffffff">

<div style="height: 420px; overflow: scroll;">
       <table width="100%" height="420px" border="1">
           <tr>
               <td width="70%" valign="top" height="400px" class="component"><jdoc:include type="component" />
                   
                </td>
                <td class="valign">
                   <table class="table1" border="0">   
                       <tr>
                         <td height="10px"> <div id="recent"> Recent Project  </div> </td>
                        </tr>
                        <tr>
                           <td> <jdoc:include type="modules" name="recentproj" /></td>
                        </tr></table>
                </td>
                </tr>
               
        </table>
</div>

</body>
</html>