Design box layout help, please

Hopefully some one can help me with this. I've been picking at this for two days and still cant get it.

This is what I'm trying to do. I want the design box use images all the way around.

Like this.

Header =>        top left corner          top center                      top right corner

center: =>        left column        __designbox_content__      right column

Footer: =>        bottom left corner      bottom center              bottom right corner

I've got the header and footer looking good but, I cant the left and right column working.

This is what I have so far.

#### design_box1.html  ####

<div class="disignBoxFirst">             
<div class="boxFirstHeader">    
<img src="<bx_image_url:db_first_header_right_corner.gif />" alt="" title="" class="dbTopRightCorner" />         
<img src="<bx_image_url:db_first_header_left_corner.gif />" alt="" title="" class="dbTopLeftCorner" />            
<div class="dbTopTitle">__title__
</div>            __caption_item__             
</div>
<div class="db_left_col">        
<img src="<bx_image_url:column_left.gif />" alt="" title="" class="db_left_col" />     
</div>
<div class="db_right_col">        
<img src="<bx_image_url:column_right.gif />" alt="" title="" class="db_right_col" />
</div>

<div class="boxContent">                __designbox_content__                         
<div class="clear_both">
</div>        
</div>        
<div class="boxContentFooter">            
</div>         
<div class="clear_both">
</div>         
<div class="dbFooter">            
<img src="<bx_image_url:db_first_footer_lcor.gif />" alt="" title="" class="dbFooterLeftCorner" />             
<img src="<bx_image_url:db_first_footer_rcor.gif />" alt="" title="" class="dbFooterRightCorner" />                 
</div>
</div>

#### design box Css ####

/* * * * DesignBox * * * */

.disignBoxFirst {
border:1px solid #CCC;
margin-bottom:10px;
background-color: transparent;
position:relative;
}
.boxFirstHeader {
height:55px;
padding:6px 0px 0px 10px ;
font-size:12px;
color:#333;
font-weight: bold;
text-align:left;
text-transform:capitalize;
border-bottom: 0px solid #CCC;
background-image:url(../images/db_first_header_cutting.gif);
background-repeat:repeat-x;
position:relative; /*need to 236*/
font-family:Verdana,Arial;
}

.dbTopRightCorner {
position:absolute;
top:0px;
right:0px;

}
.dbTopLeftCorner {
position:absolute;
top:0px;
left:0px;
}

.dbTopTitle {
position:absolute;
top:18px;
left:40px;
height:29px;
width:100%;
}

.dbTopMenu {
position:relative;
margin:6px 0px 0px 10px;
background-image:none;
}
.db_left_col {
background-image:url("../images/column_left.gif");
float: left;
background-repeat:repeat-y;
border:0px solid green;
padding-left:0px;
padding-top:0;
position:relative;


}

.db_right_col {
background-image:url(../images/column_right.gif);
float: right;
background-repeat:repeat-y;
border:0px solid red;
padding-right:0px;
padding-top:0;
position:relative;
}

.boxContent {
position:relative;
font-size:10px;
color:#fff;
font-family:Verdana;
background-color:#fff;
margin-right:30px;
margin-left:30px;
overflow:visible;
}



.dbFooter {
height:83px;
border:0px solid #00ff00;
margin-top:20px;
background-image:url(../images/db_first_footer_cutting.gif);
background-repeat:repeat-x;
background-color: transparent;
position:relative;
top:-10px;
}

.dbFooterLeftCorner {
position:absolute;
bottom:-9px;
left:-1px;
}

.dbFooterRightCorner {
position:absolute;
bottom:-9px;
right:-1px;
}

Do you have an example of what you're trying to get this to look like?

Sorry his is the best example I can give you at this time. It doesn't  look exact. But what i'm after is, I want all the images to meet and form one big image. I don't have the actual images made yet. I want to get the layout working before I go through the work of making the images.

A lot of people will kick me for suggesting this. But what your trying to do is very easy with a table.

<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td>Top Left Corner</td>
<td>Top Center</td>
<td>Top Right Corner</td>
</tr>
<tr>
<td>Left Center</td>
<td>__designbox_content__</td>
<td>Right Center</td>
</tr>
<tr>
<td>Bottom Left Corner</td>
<td>Bottom Center</td>
<td>Bottom Right Corner</td>
</tr>
</table>

Thanks deno, I think that would work but.... I would like to stay away from that method. I'll give it a try though.