Slice it into three rows.
Top will have the top horizontal part of the box. Place it in a div called #top.
Set the width and height to this div and no need to repeat.

Middle slice just needs to be a slice of about 3px high by the width.
Place this in a div called #middle as the background image. Repeat-y and set the width. Now this is where you will put the content. This div will expand down with more content.

Slice the bottom portion of the box and place it in a div called #bottom. Set the width and height to this div- no need to repeat.

This can all be nested inside another div if it helps you to place it correctly on the page.

This box is famous for having spaces so make sure to add this to your css:

Code: Select all

* {
margin: 0 
padding: 0;
}