Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Westi on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to set scrollbar in table cell?

Status
Not open for further replies.

kippie

Technical User
Nov 8, 2001
158
In the HTML below I have a function which places different texts in the cell 'textframe'. Now I would like to make it so that if the text is too big for the cell, a scrollbar appears in the table cell, while the table cell itself should keep the original set dimension. I thought the code below should work but it doesn't. What do I do wrong?
This is the HTML:
<html>
<head>
<script language=&quot;JavaScript&quot;><!--
//This is the function to change text on a changing background:
function htmlChange(id,message,bg){
d=document;
re=d.all?d.all[id]:d.getElementById(id);
re.style.padding = &quot;80px&quot;
re.innerHTML=message;
re.style.background = &quot;url(&quot;+bg+&quot;)&quot;;
}

var msg1 = 'This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1This is text1'
var msg2 = 'And this is text2'

// -->
</script>

</head>
<body>
<table border=&quot;1&quot; bordercolor=&quot;red&quot; width=&quot;500&quot; height=&quot;325&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; style=&quot;table-layout: fixed; width: 500; height:325; overflow: auto;&quot;>
<tr height=&quot;25&quot;>
<td id=&quot;headmenu&quot; colspan=&quot;2&quot; height=&quot;25&quot;><a href=&quot;#&quot; onclick=&quot;htmlChange('textframe',msg1,'bgWhite.gif');&quot;>Link1</a> <a href=&quot;#&quot; onclick=&quot;htmlChange('textframe',msg2,'bgMidnightBlue.gif')&quot;>Link2</a></td>
</tr>
<tr height=&quot;300&quot;>
<td id=&quot;textframe&quot; bgcolor=&quot;#4169e1&quot; width=&quot;384&quot; height=&quot;300&quot;>This is the text in the textframe</td>
</tr>
</table>
</body>
</html>

Kippie

 
Hi Kippie,

Try this:

<td width=200 height=90>
<div style=&quot;width:200px; height:90px; overflow:scroll&quot;>
Text1Text2 Text1Text2Text3Text4Text5Text6Text7 Text1Text2Text3Text4 Text1Text2Text3Text4Text5Text6Text7 Text1Text2 Text1Text2Text3 Text1Text2Text3Text4 Text1Text2Text3Text4Text5 Text1Text2Text3Text4Text5Text6
</div>
</td>

Hope this helps,
Erik

<!-- My sport: Boomerang throwing !!
This year I will participate at the World Championships in Germany. (!! Many Happy Returns !! -->
 
Hi Boomerang,
Thanks. I begin to understand a little bit now. If I start the HTML there comes indeed a window with two scrollbars. Is there a way to let only the vertical bar come and leave the horizontal scrollbar away. And I don't know how to get the scrollbars when pressing the links. They seem to disappear somehow. Do you know why?
Kippie
 
You can set overflow-y only if you want.

<TD style=&quot;width:200px; height:90px;overflow-y:auto;overflow-x:hidden&quot;>

</TD>

<bb/>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top