Scrollable div in <td> not work in firefox 1

[Badgers]

Help,

I have a page like :

100% height and width 100%
----outer table----------
- -
-------------------------
-<td>
- <div height 100% and scroll within td>
-</td>
-
-------------------------

The problem I want to div to scroll within the div and automatically resize with the browser. This works fine in IE but not in netscape.

Here is the code: any help would be great


<table height="100%" width="100%" border="1">
<tbody>
<tr height="200">
<td> and stuff</td>
</tr>
<tr>
<td>
<div style="width:100px; height:100%; background-color:#cccccc; overflow:scroll;">
1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />
1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />
1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />1<br />2<br />

</div>
</td>
</tr>
</tbody>
</table>

Thanks

 

[Vragabond]

What is this obsession with reinventing the scrollbars? If you use 100% of width and 100% of height, isn't that a browser window? And isn't it true that you could achieve the same effect with no code at all?

 

[TamedTech]

<style>
.scrollable {
width: 100%;
height: 390px;
overflow: auto;
}
</style>

then set the class of your TD to .scrollable.

I think that should give you what you want.

Rob

 

[Badgers]

Thanks for your interesting comment I am not trying to re-invent anything.

What I am trying to do is :

1. Have a table 100% in width and height
2. Within a td have a div with will resize to the height of the td and scroll.

This will enable when the browser is reiszed, the div will resize to the height and width of the td and scroll as needed.

 

[Badgers]

Cheers Rob, the problem with that I want to height to be 100%, refer to the bit above.

Cheers

 

[Vragabond]

First of all, is your table 100% high in FF anyway? Because without some tinkering, 100% height is not that easy to achieve. What doctype are you using on the page? I still think you are trying to reinvent things -- if nothing else frames, which are really not worth reinventing. With your counter-intuitive design you also have to understand that mouse scrolling in Geckos will not be an option, since they do not support mouse scrolling on scrollable divs.

I would still suggest you just use regular page stuff. If you want the header to remain on your page at all times, look into fixed positioning in standard compliant browsers and some JS tinkering in IE.

 

[Foamcow]

I think there is probably a better/easier way to do what you are trying to do.
Can you show an actual code example, or a link to the page itself?

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK