Table Coding?, Having some trouble getting this to work. Options

[fainaru]

I'm only posting this because I've spent over 2 days trying to get this to work. I can't seem to make my BG repeat and have the footer images get be placed where they're supposed to.

The code for the index:

CODE

<link rel="stylesheet" type="text/css" href="v2style.css">

<table border="0" cellpadding="0" cellspacing="0" width="760" height="100%" align="center" id="bg">
<tr><td id="top_01"></td></tr>
<tr><td id="top_02">
<a href="index.php">Index</a> -
<a href="about.php">About</a> -
<a href="contact.php">Contact</a> -
<a href="credits.php">Credits</a> -
<a href="portfolio.php">Portfolio</a> -
<a href="textures.php">Textures</a> -
<a href="plugboard.php">Plugboard</a> -
<a href="links.php">Links In/Out</a>
</td></tr>
<tr><td id="image"></td></tr>
<tr><td class="navigation">
<h1>Navigation</h1>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>
<a href="">Hi</a><br>

</td></tr>

<td class="center"></td>
<tr><td class="content">
<h1>Content</h1>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>
Hi<br>

</tr></td>

<tr><td id="bottom_01"></td></tr>
<tr><td id="bottom_02"></td></tr>
<tr><td id="bottom_03"></td></tr>
</table>


</table>

and the css coding for just the tables:

CODE

#top_01

{

    text-align: center;
    width: 760px;
    height: 16px;
    background-image: url(top_01.jpg);
    background-repeat: no-repeat;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
}

#top_02

{

    text-align: center;
    width: 760px;
    height: 42px;
    background-image: url(top_02.jpg);
    background-repeat: no-repeat;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
    color: #868967;
    font-size: 8pt;
    text-align: center;
        font-family: verdana, sans-serif;
        cursor: default;
}


#top_02 a

{

    font-size: 8pt;
        color: #000000;
        font-weight: bold;
    cursor: default;
    text-decoration: none;

}

#top_02 a:hover

{

    font-size: 8pt;
        color: #868967;
        font-weight: bold;
    cursor: default;
    text-decoration: none;

}

#bottom_01

{

    text-align: center;
    width: 770px;
    height: 15px;
    background-image: url(bottom_01.jpg);
    background-repeat: no-repeat;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
    font-size: 8pt;
        font-family: verdana, sans-serif;
        cursor: default;

}

#bottom_02

{

    text-align: center;
    width: 770px;
    height: 16px;
    background-image: url(bottom_02.jpg);
    background-repeat: no-repeat;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
    font-size: 8pt;
    text-align: center;
        font-family: verdana, sans-serif;
        cursor: default;

}


#bottom_03

{

    text-align: center;
    width: 770px;
    height: 16px;
    background-image: url(bottom_03.jpg);
    background-repeat: no-repeat;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
    font-size: 8pt;
    text-align: center;
        font-family: verdana, sans-serif;
        cursor: default;

}

#bg

{

    text-align: center;
    width: 760px;
    background-image: url(bg.jpg);
    background-repeat: repeat-y;

}

td.navigation

{

    width: 180px;
        height: 100%;
    font-size: 8pt;
    text-align: justify;
        font-family: verdana, sans-serif;
        cursor: default;
    padding-left: 200px;
        position: absolute;
        top: 320px;

}

td.navigation a

{

    font-size: 8pt;
    text-align: justify;
        font-family: verdana, sans-serif;
        cursor: default;
    padding-left: 145px;
        background-color: #FFFFF;

}


td.navigation a:hover

{

    width: 180px;
    font-size: 8pt;
    text-align: justify;
        font-family: verdana, sans-serif;
        cursor: default;
        background-color: #BCC09C;

}

td.content

{
    width: 556px;
        height: 100%;
    font-size: 8pt;
    text-align: justify;
        font-family: verdana, sans-serif;
        cursor: default;
    padding-left: 140px;
        position: absolute;
        top: 320px;

}

It may seem like a lot, true, but that's just me and overduing some CSS.

If anyone can help/is good with tables that can help I'd be very grateful. ^^ Then the topic can be closed.

LINK FOR PREVIEW