Click to See Complete Forum and Search --> : scrolling table cell in PHP?
jwlms
06-23-2004, 09:33 AM
Hi everyone,
I'm very new to PHP and I have been designing a page that consists of a table on the main index page that calls an include to place the content into a cell in the middle of the page. Problem is, the text for that cell is too long. Is there a way to make the table cell scroll? I've searched for info on scrolling table cells and everything I've found doesn't work in all browsers.
Thanks in advance,
Jessica
shimon
06-23-2004, 09:47 AM
Hi Jessica - welcome to the forum!
Now then...the good news is there's a solution, though it doesn't require PHP - you need to do it in HTML and CSS. You'll need a scrolling <div> element in there.
So
<table>
<tr>
<td><div class="scroll">Your text here, which may be quite long</div></td>
</tr>
</table>Now that's quite simplified but you get the idea.
Then you need to set up a CSS rule for that 'scroll' class, it might look like:
.scroll{
width:200px;
height:200px;
overflow:auto;
}
that should do it :)
jwlms
06-23-2004, 11:00 AM
Thanks for the example --
does the div tag work in all browsers (4.0 and higher, I mean)?
Also, since I don't know a lot about CSS, do I put the class part of the code you gave me into the head tags?
Thanks!
Jessica
shimon
06-24-2004, 04:18 AM
Good questions...
The scrolling <div> most likely won't work in _all_ browsers (I'm guessing an antique piece of junk like Netscape 4 will have a problem with it) but as far as I know it works fine with all modern standards-compliant browsers. I've used it with Opera7 and Mozilla on Linux, and I'm reliably informed it works fine with IE 5 and 6. So I would personally classifiy it as 'safe to use' :)
As for where you place that rule, yes you can place it in the head:
<html>
<head>
<!-- other stuff e.g. page title -->
<style type="text/css" media="screen">
<!--
.scroll{
width:200px;
height:200px;
overflow:auto;
}
-->
</style>
</head>
<body>
<table>
<tr>
<td><div class="scroll">Your text here, which may be quite long</div></td>
</tr>
</table>
<!-- rest of page -->
Though, I tend to think it's a little neater to keep it in an external stylesheet file. Just place the code in a file, call it something.css and call it in like so:
<head>
<!-- other stuff -->
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
</head>
and let me know how you get on :)
[Edit] I've just visited your website by the way, it's very nice :) You sure know a lot about babies!