setting a background that grows or shrinks

[shamai]

so I’m getting really frustrated.
i have a webpage and it has a whole container filled with stuff.
under that i have about 200px of nothing till the viewport ends. i wanted to fill that with a seamless background image (2kb in size).
and if you stretch the window it should grow
i can’t seem to figure out how to do this properly.

i can set the whole body under the container to this background and it will only show at the bottom but isn’t that still going to load the whole background even if you cannot see it? and waste bandwidth

[davidlab.be]

Not sure what you are asking exactly. About 70% (just a guess) of all websites these days use some sort of background images that repeat to fill up space….wether it is a header, footer, sidebar or body. Keep the file small and you will be just fine. Avoid using full page images. By using one small image it reduces server request as the site calls for the image once and thus speed should not be an issue.

[Mottie]

I think what you are asking is “why doesn’t the body fill the entire browser window?”… Try setting the html and body to 100% height, but clear the margins otherwise you’ll always get a scroll bar:

html,body {

height: 100%;

margin: 0;

}

[Senff]

You said the background image (that you want to show repeating under the container until the viewport ends) is only 2kb, so bandwidth is not even an issue. Just put it on the body and it’ll be fine.

[shamai]

alright got it.
i used body background. i just thought that would make it slow but nope… guess not

[Author]

Posts