Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 08-26-2010, 04:46 PM   PM User | #1
schestnut
New to the CF scene

 
Join Date: Aug 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
schestnut is an unknown quantity at this point
Need help with scrolling div around table with growing content

I want a table's height to grow and scroll as the rows are dynamically added.

I am currently using the following but the scroll bar won't show without a fixed height:
overflow: auto;


But, when the fixed height is used that causes the problem with the div being huge and waiting for content.

Ideally, the table would scroll after 10 rows are created.

Is there a way for the div to collapse and just grow vertically as the table grows and after 10 rows begin scrolling?
schestnut is offline   Reply With Quote
Old 08-26-2010, 07:18 PM   PM User | #2
teedoff
Senior Coder

 
Join Date: Aug 2010
Location: High Point, NC
Posts: 3,325
Thanks: 5
Thanked 363 Times in 360 Posts
teedoff is on a distinguished road
wrap a div around the table like this:

Code:
<div style="overflow:auto; height:500px;"></div>
set height and or width to whatever you need

Dont for get to put the closing div tag after the </table> tag. Hope that helps.
teedoff is offline   Reply With Quote
Users who have thanked teedoff for this post:
Decker (08-26-2010)
Old 08-26-2010, 07:22 PM   PM User | #3
schestnut
New to the CF scene

 
Join Date: Aug 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
schestnut is an unknown quantity at this point
Thank you for such a quick reply.
Unfortunately when I apply a 500px height, the div is fixed at 500px height and takes up that much space on the page.

I need the div to be, for the lack of a better phrase, "flat" until the div is filled in dynamically with rows. Basically grow as needed.
schestnut is offline   Reply With Quote
Old 08-26-2010, 08:14 PM   PM User | #4
teedoff
Senior Coder

 
Join Date: Aug 2010
Location: High Point, NC
Posts: 3,325
Thanks: 5
Thanked 363 Times in 360 Posts
teedoff is on a distinguished road
Thats what I had the height set as in my page. Play around with it for your own personal preference.
teedoff is offline   Reply With Quote
Old 08-26-2010, 08:16 PM   PM User | #5
teedoff
Senior Coder

 
Join Date: Aug 2010
Location: High Point, NC
Posts: 3,325
Thanks: 5
Thanked 363 Times in 360 Posts
teedoff is on a distinguished road
I have a script on my page that allows 100 rows with navigation links to page through each 100 records in my databse. Maybe something else to look at.
teedoff is offline   Reply With Quote
Old 08-26-2010, 08:17 PM   PM User | #6
schestnut
New to the CF scene

 
Join Date: Aug 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
schestnut is an unknown quantity at this point
I think you misunderstood what I meant with my post. What I am trying to say is that I don't need a height attribute of any value on my page unless there is a way to make it collapse to zero and grow as needed. If I use any fixed height value the div stays that large and then scrolls after that.
schestnut is offline   Reply With Quote
Old 08-27-2010, 12:25 AM   PM User | #7
teedoff
Senior Coder

 
Join Date: Aug 2010
Location: High Point, NC
Posts: 3,325
Thanks: 5
Thanked 363 Times in 360 Posts
teedoff is on a distinguished road
MAybe I did misunderstand, sorry. The way I have my page is when I perform a dynamic search, and 20 rows are returned in a dynamic table then it doesnt need or contain a scroll bar. If the results are returned and there are more rows than the div will allow, then the scroll bar will be utilized. Maybe post your code and explain again what you want, or post a site that contains the exact thing you're looking for. Sorry again for the misunderstanding. Good luck.
teedoff is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 02:04 PM.


Advertisement
Log in to turn off these ads.