Sorry friend, but i don't think you can make it works as you wish without scripting. The IE behavior is not trully the correct. Seens that overflow only works if the element has a constant width or height. As you can check by adding a valid DTD do your document, and seeing that don't even MSIE scroll the top cell.
You may find some css technic to add this behavior, maybe using a tableless layout. But you should consider using a fixed height top div, before start reasearching. __ Paulo Diovani Gonçalves [email protected] http://diovani.com > -----Mensagem original----- > De: Passiday [mailto:[email protected]] > Enviada em: quarta-feira, 2 de dezembro de 2009 20:25 > Para: Design the Web with CSS > Assunto: [Design with CSS 2689] Vertical scrollbar in a stretchy table > cell > > Hello, > > I am puzzled why my simple code does not work: > > <html> > <head> > <title>Top</title> > <style> > body { > overflow: auto;} > > td { > padding: 0px; > margin : 0px} > > </style> > </head> > > <body style="margin:0px"> > <table width="100%" height="100%" style="border- > collapse:collapse; > padding:0px; margin:0px"> > <tr> > <td style="background:#00ffee;"> > <div style="height:100%; overflow:auto"> > Looong dummy text in here > </div> > </td> > </tr> > <tr> > <td style="height:80px; bacground:#eeeeee"> > Dummy text here > </td> > </tr> > </table> > </table> > </body> > </html> > > You will have to replace the "Looong dummy text in here" with > something really long, to see what I'm talking about. > > MSIE actually renders this correctly. The idea is that the bigger top > area adjusts it's size depending on the size of the web browser > window. The bottom area's height should be fixed 80px at all times. > Since the top area can possibly contain info that takes up more > vertical space than is available, a vertical scrollbar should be > introduced, once the content can not fit in. The bottom area must stey > where it is - at the bottom part of the browser window. > > I have been reading that CSS' height:100% works only if the height of > it's containing container is known. I thought that it indeed is, > because the table's height is equal to the browser's window height, > and of the two table rows, one is of fixed height. And MSIE seems to > support this concept. > > So the question is, can I make Firefox render this correctly? I can > easily imagine that I could stick a JavaScript code to the windows > onsize event, where I read the top areas height and set the height > property of the div that contains all the content. But I hoped that I > could avoid using scripting. > > Thanks! > > -- Passiday > > -- > -- > You received this because you are subscribed to the "Design the Web > with CSS" at Google groups. > To post: [email protected] > To unsubscribe: [email protected] -- -- You received this because you are subscribed to the "Design the Web with CSS" at Google groups. To post: [email protected] To unsubscribe: [email protected]
