A Div with Three background images? Head - Foot- Back?

[Nerdygeek]

I've been holding off on asking this question for too long.

And it's been hampering my use of CSS sprites.

If I have a Div that has a background that repeats Y a header for the top and a footer for the bottom.

It holds quotes, contact forms or sidebar content.

How do I change it from using this?

HTML

<div id="cbox">
<img src="images/chd1.png" alt="cform" class="imgtop"" />
<h3>Quick Contact & Call Back Form</h3>
Form
<img src="images/chd1.png" alt="cform" class="imgbot"" />
</div>

CSS

#cbox {width: 289px; background: url(images/cbg.png) repeat-y; position:relative;}

to using purely CSS?

I tried a number of different Google searches and can't find anything or I'm just using the wrong keywords.

Thanks.

[katierosy]

Please attach a Ref URL to have a clear view of your Questions

[WebJoel]

An element cannot have three background-images. You CAN however, insert three images into a (position:relative) DIV element if they (the images) have "position:absolute;" value. These are 'out of the document flow' and can overlap. The text content z-index:n sit on-top of all of these three images, as it is unaffected by the "position:absolute;" which behaves ghost-like and stays 'in the background.)

Also, -what is this?

<div id="cbox">
<img src="images/chd1.png" alt="cform" class="imgtop"" />
<h3>Quick Contact & Call Back Form</h3>
Form
<img src="images/chd1.png" alt="cform" class="imgbot"" />
</div>

double-double quotes? Won't work

would be helpful to see the whole site if it exists yet

[Nerdygeek]

I haven't uploaded the sites but you're idea sounds good.

It is a rounded corner contact form.

I could use CSS3 but it's not fully supported yet.

I'll try this and see where it takes me.

Cheers.