LayOut Trouble

[eXceed69]

I starting to work on my personal page and here it is shown below:

My problem is I don't had a footer below, I can't code it...can some one please tell me how to had a footer.

CSS code

body 
{ margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: #FFFAFA;
}
a:link {
color: #1C1C1C;
text-decoration: none;
}     /* unvisited link */
a:visited {
color: #1C1C1C;
text-decoration: none;
}  /* visited link */
a:hover {color: #0099CC}   /* mouse over link */
a:active {color: #0099CC}   /* selected link */

.seperators {color: white}/* Navigation selector */
#nav {
 color: #FFFFFF;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
#nav  a:link {
color: #FFFFFF;
text-decoration: none;
}     /* unvisited link */
#nav  a:visited {
color: #FFFFFF;
text-decoration: none;
}  /* visited link */
#nav a:hover {color: #0099CC}   /* mouse over link */
#nav  a:active {color: #0099CC}   /* selected link */

/* menu*/

/* left column  */
#left {
  position: absolute;
  left: 15px;
  top: 160px;
  width: 200px;
  background: #F5F5F5;
  border-bottom: 0.5pt solid RGB(0,0,0);
  border-right: 0.5pt solid #D3D3D3;
  }
#left  .searchengine {
  width: 180px; 
  margin: 10px;
  background: #DCDCDC; 
  padding-bottom: 4px;
  padding-top: 4px; 
  border-bottom: 0.5pt solid RGB(0,0,0);
  }
#left img {width: 180px; margin: 10px;}
#left .leftbox {width: 180px; margin: 10px;}
#left .leftbox .leftheaderbox {
  background: url('../images/Header.gif') #E2E2E2;
  background-repeat: no-repeat; 
  height: 30px; 
  font-size: 14px; 
  font-weight: bold; 
  border-bottom: 0.5pt solid RGB(0,0,0);
}
#left .leftbox .leftheaderbox span {
  top: 7px; 
  left: 6px; 
  position: relative; 
  color: #F0F8FF;
}
#left .leftbox .leftheaderlist {
  background: url('../images/headerlist.gif') #E2E2E2;
  background-repeat: no-repeat; 
  height: 25px; 
  font-size: 12px; 
  font-weight: bold; 
  border-bottom: 0.5pt solid RGB(0,0,0);
}
#left .leftbox .leftheaderlist span {
  top: 7px; 
  left: 7px; 
  position: relative; 
  color: #F0F8FF;
}
#left .leftbox .leftboxlist{
  border-top: 1px outset;
  font-size: 10px;
  background: #E2E2E2;
  background-repeat: no-repeat;
  background-position: 5px;
  padding-left: 18px;
  padding-top: 4px;
  height: 18px;
  border-left-style: none; 
  border-right-style: none;
  border-top-style: none;
  border-bottom: 0.5pt solid RGB(0,0,0);
}
/* middle column  */
#center {
  position: absolute;
  top: 155px;
  width: 543px;
  margin-left: 230px;
  margin-right: 230px;
  background: #F5F5F5;
  border-bottom: 0.5pt solid RGB(0,0,0);
  border-right: 0.5pt solid #C8C8C8 ;
  }
#center .middlenav{
width: 543px;
height: 20px; 
background: #A80000;
border-bottom: 1.5pt solid #D2B48C;
}
#center .middlecontent{
width: 543px;
}
#center .middlecontent .title{
position: relative; 
font-size: 12px;
font-weight: bold;
text-align: left; 
margin: 5px;
background: #D3D3D3;  
color: #708090;
border-top: 1.5pt solid #A80000;
border-bottom: 1.5pt solid #A80000;
}
#center .middlecontent .content{
position: relative; 
margin: 5px;
font-size: 10px;
text-align: justify;  
text-indent: 5px;
}

/* right column  */
#right {
  position: absolute;
  right: 15px;
  top: 160px;
  width: 200px;
  background: #F5F5F5;
  border-bottom: 0.5pt solid RGB(0,0,0);
  border-right: 0.5pt solid #D3D3D3;
  }
#right .rightbox {width: 180px; margin: 10px;}
#right .rightbox .rightheaderbox {
  background: url('../images/Header.gif') #E2E2E2;
  background-repeat: no-repeat; 
  height: 30px; 
  font-size: 14px; 
  font-weight: bold; 
  border-bottom: 0.5pt solid RGB(0,0,0);
}
#right .rightbox .rightheaderbox span {
  top: 7px; 
  left: 6px; 
  position: relative; 
  color: #F0F8FF;
}
#right .rightbox .rightheaderlist {
  background: url('../images/headerlist.gif') #E2E2E2;
  background-repeat: no-repeat; 
  height: 25px; 
  font-size: 12px; 
  font-weight: bold; 
  border-bottom: 0.5pt solid RGB(0,0,0);
}
#right .rightbox .rightheaderlist span {
  top: 7px; 
  left: 7px; 
  position: relative; 
  color: #F0F8FF;
}
#right .rightbox .rightboxlist{
  border-top: 1px outset;
  font-size: 10px;
  background: #E2E2E2;
  background-repeat: no-repeat;
  background-position: 5px;
  padding-left: 18px;
  padding-top: 4px;
  height: 18px;
  border-left-style: none; 
  border-right-style: none;
  border-top-style: none;
  border-bottom: 0.5pt solid RGB(0,0,0);
}

[eXceed69]

Here are html code,please help me

<body onLoad = "scrollit(100)">
<script src="scripts/statusbar.js" language="javascript"></script>
<script src="scripts/norightclick.js" language="javascript"></script>
<!--Start of the page -->
<!--Banner and Navigation bar -->
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#1C1C1C">
   <tr>
    <td colspan="3">
 <table width="100%" border="0" cellpadding="0" cellspacing="0" background="images/bar.jpeg">  
   <tr>
        <td><img src="images/onalogo.png" alt="I dream to exceed to the highest peak" width="264" height="100" /></td>
        <td width="100%">
  <div align="center"></div></td>
      </tr>
    </table>
 </td>
  </tr>
  <tr>  
<td colspan="3">
 <table width="100%" border="0" cellpadding="0" cellspacing="0" background="images/nav_bg.gif">
      <tr>
        <td width="50%"></td>
        <td valign="top">
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td><img src="images/nav_left.gif" width="7" height="36" /></td>
            <td width="100%" nowrap="nowrap" bgcolor="#708090"><span id="nav">&nbsp;<strong><a href="#">Home</a></strong><span class="seperators"> &nbsp;|&nbsp; </span><strong><strong><a href="#">Articles</a></strong><span class="seperators"> &nbsp;|&nbsp; </span><a href="#">Development</a></strong><span class="seperators"> &nbsp;|&nbsp; </span><strong><a href="#">Contour</a></strong><span class="seperators"> &nbsp;|&nbsp; </span><strong><a href="#">Outre</a></strong><span class="seperators"> &nbsp;|&nbsp; </span><strong><a href="#">Blogs</a></strong><span class="seperators"> &nbsp;|&nbsp; </span><strong><a href="#">Contact</a></strong>&nbsp;</td>
            <td><img src="images/nav_right.gif" width="7" height="36" /></td></div>
          </tr>
        </table>
  
  </td>
        <td width="100%">&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table>
<!--Start of the Middle page -->
<div id="center">
<div class="middlenav"></div>
<div class="middlecontent">
<div class="title">
Research: What is the effect of Engineering and Public Policy (E.P.P.) to <br>
engineering competitiveness if it adapted in the Philippines?
</div>
<div class="content">
This research is designed fo9r Filipino engineering students and engineers to illustrate the 
possible effect of Engineering and Public Policy (E.P.P.) if it is adapted in the Philippines
Now, Filipino engineers and engineering student are making a way to more competitiveness and 
gaining more confident in the globe. Engineering and Public Policy is a research-oriented program that focuses in engineering fields and that may benefit the society. United States use this program that leads in the development and implementation of responsible strategies and policies for exploitation of technology for the benefit of the society.
</div>
</div>
<br />
<div class="middlecontent">
<div class="title">
Research: What is the effect of Engineering and Public Policy (E.P.P.) to <br>
engineering competitiveness if it adapted in the Philippines?
</div>
<div class="content">
This research is designed fo9r Filipino engineering students and engineers to illustrate the 
possible effect of Engineering and Public Policy (E.P.P.) if it is adapted in the Philippines
Now, Filipino engineers and engineering student are making a way to more competitiveness and 
gaining more confident in the globe. Engineering and Public Policy is a research-oriented program that focuses in engineering fields and that may benefit the society. United States use this program that leads in the development and implementation of responsible strategies and policies for exploitation of technology for the benefit of the society.
</div>
</div>
<br />
<div class="middlecontent">
<div class="title">
Research: What is the effect of Engineering and Public Policy (E.P.P.) to <br>
engineering competitiveness if it adapted in the Philippines?
</div>
<div class="content">
This research is designed fo9r Filipino engineering students and engineers to illustrate the 
possible effect of Engineering and Public Policy (E.P.P.) if it is adapted in the Philippines
Now, Filipino engineers and engineering student are making a way to more competitiveness and 
gaining more confident in the globe. Engineering and Public Policy is a research-oriented program that focuses in engineering fields and that may benefit the society. United States use this program that leads in the development and implementation of responsible strategies and policies for exploitation of technology for the benefit of the society.
</div>
</div>
<br />
<div class="middlecontent">
<div class="title">
Research: What is the effect of Engineering and Public Policy (E.P.P.) to <br>
engineering competitiveness if it adapted in the Philippines?
</div>
<div class="content">
This research is designed fo9r Filipino engineering students and engineers to illustrate the 
possible effect of Engineering and Public Policy (E.P.P.) if it is adapted in the Philippines
Now, Filipino engineers and engineering student are making a way to more competitiveness and 
gaining more confident in the globe. Engineering and Public Policy is a research-oriented program that focuses in engineering fields and that may benefit the society. United States use this program that leads in the development and implementation of responsible strategies and policies for exploitation of technology for the benefit of the society.
</div>
</div>
<br />
</div>
<!--Start of the Left Side page -->
<div id="left">
  <div class="leftbox">
    <div class="leftheaderbox">
 <span>Tracker</span></div>
 <div class ="leftheaderlist">
 <span>Right now</span>
 </div>
 <div class="leftboxlist"><script language="javascript">
    YourDate = new Date();
 document.write(YourDate.toGMTString());
    </script></div>
 <div class="leftboxlist">Current Time</div>
 <div class="leftboxlist">Guest</div>
    <div class="leftboxlist">hits</div> 
 <div class ="leftheaderlist">
 <span>Time spend</span></div>
 <div class="leftboxlist">Time</div>
  </div>
<img src="images/LpuLogo.jpg" width="180" height="40" alt="Veritas Et Furtitodo" />
<div class="searchengine">
<input type="text" name="searchfor" value="" size="20">
<input type="button" value="Search" onClick="checkDatabase()">
</div>
<div class="leftbox">
    <div class="leftheaderbox">
 <span>Quaker's Watch</span></div>
 <div class="leftboxlist"><a href="http://www.friendster.com/35613828">Shiela Marie Alversado</a></div>
 <div class="leftboxlist"><a href="#">Raymond Laniog</a></div>
 <div class="leftboxlist"><a href="http://www.friendster.com/4459019">Jayvee Vitugz</a></div>
    <div class="leftboxlist"><a href="http://www.friendster.com/6720409">Robin Binarao</a></div>
    <div class="leftboxlist"><a href="#">Jerson Raul Cruz</a></div>
    <div class="leftboxlist"><a href="#">Ann Kristine Echavez</a></div>
    <div class="leftboxlist"><a href="#">Gianne Dazo</a></div> 
  </div>
</div>
<!--Start of the Right Side page -->
 <div id="right">
 <div class="rightbox">
    <div class ="rightheaderbox">
 <span>What's inside</span>
 </div>
 <div class ="rightheaderlist">
 <span>Latest</span>
 </div>
 <div class="rightboxlist"><a href="#">OnaDOTCom Go live</a></div>
 <div class="rightboxlist"><a href="#">Repository of my dreams</a></div>
 <div class="rightboxlist"><a href="#">Industries ambients</a></div>
 <div class="rightboxlist"><a href="#">Industry a Tougher Saga</a></div>
 <div class="rightboxlist"><a href="#">Student life is over!</a></div>
 <div class ="rightheaderlist">
 <span>Development</span>
 </div>
 <div class="rightboxlist"><a href="#">2005-2006-0216-PUSH v1.0</a></div>
 <div class="rightboxlist"><a href="#">WEB-2007-0113-IE-MPW v2.0</a></div>
 <div class="rightboxlist"><a href="#">2005-06BUSReservationSyst v1.0</a></div>
 <div class ="rightheaderlist">
 <span>Tutorials</span>
 </div>
 <div class="rightboxlist"><a href="#">CPP connecting to ODBC</a></div>
 <div class="rightboxlist"><a href="#">Java connecting to ODBC</a></div>
 <div class="rightboxlist"><a href="#">ASP connecting to ODBC</a></div>
    <div class="rightboxlist"><a href="#">" Unknown "</a></div> 
 <div class ="rightheaderlist">
 <span>Recreation</span>
 </div>
 <div class="rightboxlist"><a href="#">Outdoor Games</a></div>
 <div class="rightboxlist"><a href="#">Online Games</a></div>
 <div class="rightboxlist"><a href="#">Programming & Developing</a></div>
 </div>
<br />
 
  <div class="rightbox">
    <div class ="rightheaderbox">
 <span>The Alversado's</span></div>
 <div class="rightboxlist"><a href="#">Pedro "Peter" Carlos</a></div>
 <div class="rightboxlist"><a href="#">Rebecca "Bing" Nalica</a></div>
 <div class="rightboxlist"><a href="#">Shiela Marie "She" Nalica</a></div>
    <div class="rightboxlist"><a href="#">Ronald "oNaD" Nalica</a></div> 
  </div>
<br />
 <div class="rightbox">
    <div class ="rightheaderbox">
 <span>Schedule Activities</span></div>
 <div class="rightboxlist"><a href="#">CMMI Training/s ( LVL 5 )</a></div>
 <div class="rightboxlist"><a href="#">Continous Improvement</a></div>
 <div class="rightboxlist"><a href="#">Upgrades Hardware</a></div>
    <div class="rightboxlist"><a href="#">Software Development</a></div> 
</div>
<br />
  <div class="rightbox">
    <div class ="rightheaderbox">
 <span>Resources</span></div>
 <div class="rightboxlist"><a href="http://www.good-tutorial.com">Good Tutorials</a></div>
 <div class="rightboxlist"><a href="http://www.dreamincode.net">Dream in code Forum</a></div>
 <div class="rightboxlist"><a href="http://www.dynamic.com/forum">Dynamic Drive Forum</a></div>
    <div class="rightboxlist"><a href="http://www.daniweb.com">DaniWeb Forum</a></div> 
</div>
</div>
</body>

[MidiMagic]

It can't be done in a way that works with all screen resolutions.

Anything you set up for one screen resolution will get moved when the browser is resized or the screen resolution changes.

There is no way to specify the bottom of the browser window.

[eXceed69]

Thanks anyway I figure it out i change the absolute positioning into a float...yes i want my page to be relay on the user screen resolution.