table row scrolling

@rsrimantulaDec 19.2006

I have an html table. something like
<html>
<div style”height:100px;overflow:auto”>
<table>
<tr><td>xyz</td></tr>
<tr><td>123</td></tr> ///repeated 100 times to allow scrolling
</table>
</div>
</html>

It gives me a nice table with a vertical scroll bar. Now what I want is that all the rows from 2-100 should scroll and the first row should not scroll. The scroll bar should apply only for the rows from 2-100. when I scroll down and view the 77th row, the first row should still be displayed. How can I achieve this?

Raghav

to post a comment

HTML

@ray326Dec 19.2006 — #Mark it up fully and you may have enough tag fodder to do what you'd like. Of course you're at the mercy of the browser.

http://www.w3.org/TR/html401/struct/tables.html#edef-TABLE

@KDLADec 19.2006 — #http://www.imaputz.com/cssStuff/bigFourVersion.html

KDLA

@holyhttpDec 19.2006 — #If you really want to mix table and CSS then this is one way to do it:

<html>

...

<body>

<TABLE>

<TR><TD>xyz</TD></TR>

<TR><TD>

<div style="height:100px;overflow:scroll">

<table>

<tr><td>123</td></tr> ///repeated 100 times to allow scrolling

</table>

</div>

</TD></TR>

</TABLE>

</body>

</html>

the first row is outside the div container and the scrolling rows belong to the nexted table inside the container.

@rsrimantulaauthorDec 20.2006 — #The only problem I have is that I lose the alignment of a table. if I have

<TABLE>

<TR><TD>heading1</TD><TD>heading2</TD><TD>heading3</TD></TR>

<tr><td>123</td><td>123</td><td>123</td></tr>

<tr><td>123</td><td>123</td><td>123</td></tr>

<tr><td>123</td><td>123</td><td>123</td></tr>

<tr><td>123</td><td>123</td><td>123</td></tr>

</table>

all my columns are aligned. All my values (row 2-100) fall perfectly under my first row. But then I have

<TABLE>

<TR><TD>heading1</TD><TD>heading2</TD><TD>heading3</TD></TR>

<TR><TD>

<div style="height:100px;overflow:scroll">

<table>

<tr><td>123</td><td>123</td><td>123</td></tr>

<tr><td>123</td><td>123</td><td>123</td></tr>

<tr><td>123</td><td>123</td><td>123</td></tr>

<tr><td>123</td><td>123</td><td>123</td></tr>

</table>

</div></td></tr>

</table>

my alignment is gone. I have the inner table exactly falling under "heading1" I also need the alignment to be as it was. ANy suggestions.

Raghav

@rsrimantulaauthorDec 20.2006 — #http://www.imaputz.com/cssStuff/bigFourVersion.html

KDLA[/QUOTE]

This is what I am looking for...how did u achieve this?

Raghav

@KDLADec 20.2006 — #I didn't achieve it; the author of the publication did.

Select View/View Source to access the coding.

KDLA

@rsrimantulaauthorDec 21.2006 — #"view source" doesnt give much info.. do u have any leads to the person who designed this

Raghav

table row scrolling

7 Comments(s) _↴

Also in #HTML _↴

Success!

Social

Version

table row scrolling

7 Comments(s) ↴

Also in #HTML ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

7 Comments(s) _↴

Also in #HTML _↴