Div - overflow:scroll problem

Posted Date: 30 Sep 2009 Posted By: nitkumr Member Level: Bronze Points: 1 Responses: 3

Hi,
In this i need the scroll to work only in the body of the table and the header has to remain in the same postion when i scroll.
But problem here is when i give overflow:scroll only in the tbody its not working.

I want the heading to remain in the same postion when i scroll.
Actually the "overflow:scroll" is not workin in the "<tbody>" only in div it is working.

Can you give best solution for this problem?

<div style="height: 250px;border-width:2px;border-color:#0066cc;border-style:solid">
<table border="3" bordercolor="gray" align="center" width="100%" id="displayTable" dt>
<thead>
<tr> <Th></Th>
<th>column 1</th>
<th>column 2</th>
<th>column 3</th>
<th>column 4</th>
<th>column 5</th>
<th>column 6</th>
</tr>
</thead>
<tbody style="font-size:80%;height:100%;overflow:scroll">
</tbody>
</table>
</div>

Thanks

Responses

Author: Arunagiri Gunasekaran 07 Oct 2009 Member Level: Gold Rating: Points: 2

Hi,
overflow: scroll property will work only with the div tag.
if you can, try to use div tag with in the tbody tag to fix this issue.


<DIV style="OVERFLOW: auto; HEIGHT: 100px" align="justify">

</DIV>

Hope this will help you in some ways,

ArunG

Author: Sumit Kr Verma 09 Oct 2009 Member Level: Silver Rating: Points: 2

hi,

please create a frames for table and use it in you page.

Thanks & Regards

Sumit Kr. Verma

Author: Venkatesh Ellur 26 Oct 2009 Member Level: Gold Rating: Points: 2

Hi

I think what you can do is play aorund using the tricks.
i.e have a table with header and only one cell for the content whit the col span which is equal to the number of colums in the header then have the division in the content cell. in the division have another table only for the content.

eg:

<table>
<tr>
<td class="cell1">
</td>
<td class="cell2">
</td>
<td class="cell3">
</td>
</tr>
<tr colspan=3>
<td>
<div overflow=auto>
<table>
<tr>
<td class="cell1">
</td>
<td class="cell2">
</td>
<td class="cell3">
</td>
</tr>
</table>
</div>
</td>
</tr>

</table>

THIS POSTING IS PROVIDED WITH NO WARRANTIES, BEWARE OF BUGS IN THE ABOVE CODE; I HAVE ONLY PROVED IT CORRECT AS PER MY KNOWLEDGE, NOT TRIED IT.

Regards
--------------------------
Venkatesh Ellur
+919886417764
venkatesh.ellur@gmail.com

Post Reply

You must Sign In to post a response.

	Next : Creating master pages in html
	Previous : Div - overflow:scroll problem
	Return to Discussion Forum
	Post New Message
	Category: HTML

Related Messages

dotNet Slackers

About Us Contact Us Privacy Policy Terms Of Use