.t {background: url(tb.gif) top left repeat-x; width: 100%; height: 22px; overflow: hidden; padding-top: 6px; font-weight: bold; }
.t h1 { padding: 0px; margin: 0px; padding-left: 7px; }
.tl {background: url(corner.gif) top left no-repeat; padding-left: 5px; }
.tr {background: url(corner.gif) top right no-repeat; padding-right: 5px; } 
.b {background:  url(tb.gif) bottom left repeat-x; width: 100%; padding-bottom: 5px;}
.bl {background: url(corner.gif) bottom left no-repeat; padding-left: 5px; }
.br {background: url(corner.gif) bottom right no-repeat; padding-right: 5px; }
.cl {background: url(lr.gif) top left repeat-y; padding-left: 5px; }
.cr {background: url(lr.gif) top right repeat-y; padding-right: 5px; }
.c {background: #fff; padding: 10px; }
/* Use like this:
<div style="width: 196px;">
    <div class="tl"><div class="tr"><div class="t">Title</div></div></div>
    <div class="cl"><div class="cr"><div class="c">Content</div></div></div>
    <div class="bl"><div class="br"><div class="b"></div></div></div>
</div>
*/