Jon Hughes wrote:
> I have a page with a background that needs to scroll to the bottom of
> the page... I would like to do this without having the make the
> image 8000px tall.
>
> Here is a page that is affected:
> http://goonsquad.org/santini/site/INCOTERMS2000.html
The good news: You have standard supporting browsers on your side.
In Firefox, Opera and Safari - and probably in other standard supporting
browsers too, the "automatic stretch" is achieved by establishing a
relation between the 2 'A:P' elements and body. Body stretches, so #l
and #r will stretch with it.
Add...
body {position: relative;}
...and the mentioned browsers know how to do the rest.
You can improve the appearance even more by adding...
body {float: left; width: 100%;}
...and...
#l,#r {padding-bottom: 2em;}
...to keep all collapsing margins under control and stretch the layout a
bit.
----
The bad news: IE can't handle it properly.
There's a weakness in IE (at least in IE6 and IE5.2/Mac) with
your absolute positioned, 100% tall, background-carrying elements. These
browsers can at best stretch those elements to height declared on html
and body. The addition of...
* html, * html body {height: 100%;}
...will only go so far.
----
Solution: use a method even IE can handle.
The method all browsers support is to have a couple of extra wrappers
inside body, carrying the left and right image. Making such wrappers
stretch all the way down while repeating the image - is what's called
"faux columns"[1].
regards
Georg
[1]http://www.alistapart.com/articles/fauxcolumns/
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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/
