I need to get three HTML tables shown like this:




using these images for the borders and background:
background:

Left border:


top left corner:


top:

top right corner:


right border:

bottom right corner:

bottom:

bottom left corner:


Here's the HTML and CSS I currently have.
I want all three columns in the bottom table to have that treatment.
If it could be done with no tables that would be better...

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Sir Stinks Alot Home Page</title>
    <link href="style.css"         media="screen" rel="stylesheet" type="text/css" >
  </head>
  <body>
    <table cellspacing="0" cellpadding="0" border="0" width="950" height="20">
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td align="center">
          <img src='images/logo.png' alt='Logo' />
        </td>
      </tr>
    </table>
    <table cellspacing="0" cellpadding="0" border="0" width="950">
      <tr>
        <td width="132">
          <table cellspacing="0" cellpadding="0" border="0" width="100%" class="bodytable">
            <tr>
              <td>Skin this table</td>
            </tr>
          </table>
        </td>
        <td width="20">&nbsp;</td>
        <td width="646">
          <table cellspacing="0" cellpadding="0" border="0" class="bodycr">
            <tr>
              <td align="center"> <!-- and skin this table, too -->
                <h1>Sir Stinks Alot's Home page</h1>
              </td>
            </tr>
          </table>
        </td>
        <td width="20">&nbsp;</td>
        <td width="132">
          <table cellspacing="0" cellpadding="0" border="0" width="100%" class="bodycr">
            <tr>
              <td>Skin this table</td>
            </tr>
          </table>
        </td>
      </tr>
    </table>
  </body>
</html>

a {
    background-color: transparent;
    color: #FFFFFF;
    font-family: verdana, arial, sans-serif;
    font-style: bold;
    text-decoration: underline;
}

a:link {
    background-color: transparent;
    color: #2EEC82;
    font-size: 12px;
    text-decoration: none;
}

a:visited {
    background-color: transparent;
    color: #2EEC82;
    text-decoration: none;
}

a:hover {
    background-color: transparent;
    color: #00ffff;
    text-decoration: none;
}

a:active {
    background-color: transparent;
    color: #2EEC82;
    text-decoration: none;
}

div, ul, li, table, tr, td, p, img, h2, h3, h4, h5, h6
{
  margin:0px; 
  padding:0px; 
  margin:0 auto;
}

body
{
    background-attachment: scroll;
    background-image: url(images/background.jpg);
    background-position: top left;
    background-repeat: repeat;
    scrollbar-3dlight-color: #383821;
    scrollbar-arrow-color: #7b3908;
    scrollbar-base-color: #4F472F;
    scrollbar-darkshadow-color: #4a2e26;
    scrollbar-face-color: #000000;
    scrollbar-highlight-color: #282812;
    scrollbar-shadow-color: #7b3908;
    scrollbar-track-color: #21210B;
    background-color: #000000;
    color: #FFFFC0;
    font-family: tahoma, verdana, arial, sans-serif;
    font-size: 14px;
}

td {
    background: transparent;
    color: #FFFFFF;
    font-family: verdana, tahoma, arial, helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    text-align: left;
}

.bodycr{
    background: transparent;
    background-image: url(images/tablebg.png);
    color: #00ffff;
    font-family: verdana, tahoma, arial, sans-serif;
    font-size: 12px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}

.bodylt{
    background-image: url(images/left.png);
    background-repeat: repeat-y;
    width: 34px;
}

.bodyrt{
    background-image: url(images/right.png);
    background-repeat: repeat-y;
    width: 34px;
}

.bodytable {
    background-color: transparent;
    background-image: url(images/tablebg.png);
    color: #0099bb;
    font-family: verdana, tahoma, arial, helvetica, sans-serif;
    font-size: 14px;
    font-style: normal;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

.border {
    border-bottom: #FFFFFF 1px solid;
    border-left: #FFFFFF 1px solid;
    border-right: #FFFFFF 1px solid;
    border-top: #FFFFFF 1px solid;
}

.bottomcr{
    background-image: url(images/bottom.png);
    background-repeat: repeat-x;
    width: 100%;
}

.bottomlt{
    background-image: url(images/bottomleft.png);
    width: 34px;
}

.bottomrt{
    background-image: url(images/bottomright.png);
    width: 34px;
}

.topcr{
    background-image: url(images/top.png);
    background-repeat: repeat-x;
    width: 100%;
}

.toplf {
    background-image: url(images/topleft.png);
    width: 34px;
}

.toprt {
    background-image: url(images/topright.png);
    width: 34px;
}