multiple background images/repeating an image?

[cuervo]

I'm trying to make a background of a <div> element that consists of 3 images: an upper cap, a repeating center image and a lower cap. As the element resizes, the center image would tile as needed so as to stretch the background across the element.

My problem: I don't know of a property that allows me to repeat a normal <img> element, and I don't think you can have more than one background image. Is there a way to do either of these things? if so, how?

I know that it is possible to put the repeating image in the background and place the caps in the main content of the <div> element, but the caps are partly transparent, so the repeating background would be visible behind them. There are ways around this, of course, but I wanted to see if there is a way to repeat a normal <img> element or have multiple background images first.

Thanks,
cuervo

[meesa]

There isn't a way, however, I suggest that you do something like this:


<div>
<img src="" alt="top image" />
<p>Content, this will have the repeating background</p>
<img src="" alt="bottom image" />
</div>


Then align the top image at the top, the bottom at the bottom, positon the <p> in the middle.
As the <p> content expands, the bottom image is pushed down, and the <p>'s background image is repeated.