Background resize to fit content?

Hey all! I'm in the process of setting up my website and I'm trying to find a way to have my background image (or any image) to re-size it self according to content.

My background consist of 4 corners, 4 edges and a fill for the m开发者_如何学Pythoniddle. Is it possible to have it re-size? Example of how i want to use it:

My background image currently supports about 4 paragraphs and im at the bottom. What if i want 7-8 paragraphs? Will i have to manually remake the image to be longer or can i have it take the left edge, right edge, bottom corners and bottom edge pictures and and it down? I really hope that made sense haha.

I don't want to stretch the image because it loses its resolution and looks terrible.

Thanks for your time.

No.

Make the corners and edges separate images. Top/bottom edges should be tileable horizontally; left/right edges vertically.

Then have a "middle" image as your background that either tiles or is scaled in some other way. This answer may help you there.

You can do this using css3 properties. Not all browsers support this yet!

.foo {
        background-image: url(bg-image.png);

       -moz-background-size: 100% 100%;           /* Gecko 1.9.2 (Firefox 3.6) */
         -o-background-size: 100% 100%;           /* Opera 9.5 */
    -webkit-background-size: 100% 100%;           /* Safari 3.0, Chrome */
            background-size: 100% 100%;           /* Gecko 2.0 (Firefox 4.0) and other CSS3-compliant browsers */

       -moz-border-image: url(bg-image.png) 0;    /* Gecko 1.9.1 (Firefox 3.5) */
}

https://developer.mozilla.org/en/CSS/-moz-background-size