Controls not aligning properly

I am using following code to design my home page. The output (as shown below) is not appearing properly. You can see the banner going to far left and the navigation links have a huge gap in between. How to set this? Can it be done using only the DIV tag instead of TABLE?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
  <title>
    First Website
  </title>
</head>

<body>
      <table  id="main" align="center" width="600 px">
        <tr  id="trBanner">
            <td  id="tdBanner">
                <img src="../../../My Pictures/banner copy.bmp.jpg"
            </td>
        </tr>
        <tr  id="trNavLinks">
            <td  id="lnkHome">
                  <a href="" id="lnkHome" name="lnkHome">Home</a>
            </td>
            <td  id="lnkLife">
                  <a href="" id="lnkLife" name="lnkLife">Life</a>
            </td>
            <td  id="lnkTeachings">
                  <a href="" id="lnkTeachings" name="lnkTeachings">Teachings</a>
            </td>
            <td  id="lnkExperiences">
                  <a href="" id="lnkExperiences" name="lnkExperiences">Experiences</a>
            </td>
            <td  id="lnkPhotoGallery">
                  <a href="" id="lnkPhotoGallery" name="lnkPhotoGallery">Photo Gallery</a>
            </td>
            <td  id="lnkReach">
                  <a href="" id="lnkReach" name="lnkReach">How to Reach</a>
            </td>
            <td  id="lnkContact">
                  <a href="" id="lnkContact" name="lnkContact">Contact Us</a>
            </td>
        </tr>
      </table>
</body>

</html>

alt text http://www.freeimagehosting.net/uploads/b122c4ef21.jpg

Solution

Without seeing your code very long - don't use tables!

I know it's hard for those people who developed a long time with tables in webdesign, but belive me - after you learned how to design it with CSS & DIV-Tags, you will thank god for this!

Here is a tutorial for you: http://www.colorplexstudios.com/articles/div_web_design_tutorial/

And if you want to have an answer to your code-question: It's because you have 1 cell in the first row and 3 cells in the second row. Use the colspan-attribute. You find a tutorial for this here: http://www.htmlcodetutorial.com/tables/index_famsupp_30.html