scrolling div output

[ksmatthews]

HI All,

 

I am using PHP to dynamically create and populate a table from DB data.

I need to be able to scroll the data without scrolling the header. After many attempts at using ONE table

to do this I have resorted to using two tables, as the following extract shows.....

 

This (two tables) works

 

<table>

<tr>

<th>header 1</th>

<th>header 2</th>

// etc ...

</tr>

</table>

 

<table>

<div align="left" id="scroll" >

<tr>

<td>data item 1</td>

<td>data item 2</td>

// etc ...

</tr>

</div>

</table>

 

This (one table) does not work ...

 

<table>

<tr>

<td>data item 1</td>

<td>data item 2</td>

// etc ...

</tr>

<div align="left" id="scroll" >

<tr>

<td>data item 1</td>

<td>data item 2</td>

// etc ...

</tr>

</div>

</table>

 

CSS

 

#scroll {

table-layout:fixed;

white-space: nowrap;

vertical-align:top;

width:100%;

margin-top: 0px;

margin-bottom: 0px;

overflow-y: scroll;

overflow-x: hidden;

background-color: #fbfbfb;

padding: 0px;

border-bottom: 2px groove #f1f1f1;

}

 

How on earth can I get this scrolling div to work in one table - scrolling only the data !!

 

All comments welcome,

 

regards,

 

Steven M

 

[wildteen88]

You cannot wrap a div around tr or td tags. Just apply the id to the td tag you want to allow to scroll.