Dean,
On Oct 11, 2006, at 9:19 AM, Dean Champeau wrote:
> I created a div that contains variable-height content (a big table
> that will expand and contract as the visitor changes type size). I'd
> like it to scroll while taking up the entire height of the browser
> window. So I created some properties for the div...
>
> height:100%;
> overflow:scroll;
>
> This adds a scroll bar, but it doesn't allow scrolling. If I change
> the height value to...
>
> height:auto;
>
> ... I get the same result. However, if I change the height value to...
>
> height:300px;
>
> ... then I get a scroll bar that actually scrolls the data, and it
> eliminates the browser's own scroll bar, which is the effect I want.
What you really want is position: fixed; but ie6 doesn't support
it. Alternatively, you could set the height of the table container
to 100% - the size of the header section, which you can do with
proprietary ie css behavior code, but that won't work anywhere else.
You can get close with the following:
html, body {
font-family:Verdana, Arial, Helvetica, sans-serif;
height:100%; /* this height must be set for child heights to
work */
margin: 0;
padding: 0;
}
table-container {
height:90%;
overflow:auto;
}
#data {
font-size:.8em;
border-collapse:collapse;
width:99%;
margin: 0 0 0 6px;
}
Basically, I'm allocating 10% of the window height for the header and
giving the other 90% to the data table. This is only a 'sort of'
solution because it will cause double scroll bars at short window
heights and a gap at the bottom for tall ones.
BTW, it would be more semantic html to use thead and tbody rather
than two separate tables.
--
Roger Roelofs
"Remember, if you’re headed in the wrong direction,
God allows U-turns!"
~Allison Gappa Bottke
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
