CSS Background-Repeat special interval of image

I've got a simple question :) Hopefully.

So, I wan't to repeat a website-background-image with CSS. But not pixel by pixel - no - pixelinterval by pixelinterval. For example I want to repeat pixel 0 to 100 of my background image each time it is needed on the y-axis.

For normal, if i had a background image to repeat with the dimensions of 1000*1 px, CSS would display this image each pixel-line in the browser, until it's not needed anymore. Now, if I put in a 1000*10 px image, CSS would repeat the image as long as there is the need of it PLUS only as 开发者_运维百科long as there is content to display on. That means, if there is (for example) no text to be displayed anymore, the browser would stop displaying the image, even if there were only 1000*5 px of the image displayed.

What I want is to display the full image, even if there is no content displayed on it. That means if the 1000*10 px image is repeated, it's displayed by it's full size. Everytime 1000*10 px - never less.

Is it possible to archieve that somehow?

thanks :)

You can put all of your content in one DIV.Add your img-background style to this DIV. Then with javascript you must get the height of your content , add 5px and round number to 0. Then add the new height to the DIV.

I'm not sure there's a way to do this with pure html/css that would work cross-browser, but you could look to javascript to calculate the height of your container, and work backwards from there, explicitly setting the min-height to a set interval as you'd like...