Hmmmmm...

Faking a Stretched Background Image Over a Smaller Space

You can use a similar technique to fake a stretched background image across a div or other element on your Web page. This is a bit trickier as you have to either use absolute positioning or have strange spacing issues for other parts of your page.

1. Place the image on the page that I want to use as the background.
   <img src="bgimage.jpg" alt="background" id="bg" />
2. In the style sheet, set a width and height for the image. Note, you can use percentages for width or height, but I find it easier to adjust with length values for the height.
   #bg {
   width:20em;
   height:30em;
   }
3. Place your content in a div with the id "content" as above:
   <div id="content">All your content here</div>
4. Style the content div to be the same width and height as the background image:
   #content {
   width: 20em;
   height: 30em;
   }
5. Then position the content up the same height as the image. So if your image is 30em you would have a style of top: -30em; Don't forget to put a z-index of 1 on the content.
   #content {
   position: relative;
   top: -30em;
   z-index: 1;
   width: 20em;
   height: 30em;
   }
6. Then add in a z-index of -1 for IE 6 users, as you did above:
   <!--[if IE 6]>
   <style type="text/css">
   #bg { z-index: -1; }
   </style>
   <![endif]-->

Be sure to test this in as many browsers as you can. And if your content changes size, you'll need to change the size of your container and background image, otherwise you'll end up with strange results.



Not sure if that helps at all. But it looked relevant.

Here's the link i got it from: http://webdesign.about.com/od/css3/f/blfaqbgsize.htm

The "how to" directly above the one i posted may be better for you