I aint too sure how you've put together the rounded orange boxes, the way i do these is to have 3 seperate div classes (top, middle and bottom). Ive quickly made some images to show you below but dont use them as the sizes r probably wrong lol.

Example:

Top


Middle


Bottom


So with this you would do something like.....
HTML

Code: Select all

<div class="top"></div>
<div class="middle">CONTENT HERE</div>
<div class="bottom"></div>

CSS

Code: Select all

.top{
width: 576px;
height: 35px;
background-repeat: no-repeat;
background-image: url of image goes here;
}

.middle{
width: 576px;
background-repeat: repeat-y;
background-image: url of image goes here;
}

.bottom{
 width: 576px;
height: 35px;
 background-repeat: no-repeat;
 background-image: url of image goes here;
 }

Remember not to set a height on your 'middle' div, that way the image will repeat itself automatically as you add text.

Does this make sense?

Danny322