<div id="container">
     <div id="header"></div>
     <div id="content">
          <div id="left"></div>
          <div id="right"></div>
          <div class="push"></div>
     </div>
     <div id="footer"></div>
</div>

1.  <div id="container"> 
2.       <div id="header"></div> 
3.       <div id="content"> 
4.            <div id="left"></div> 
5.            <div id="right"></div> 
6.            <div class="push"></div> 
7.       </div> 
8.       <div id="footer"></div> 
9.  </div> 

#container {
	position: relative;
}
#content {
	position: relative;
	top: 0;
	width: 900px; 
	margin: 0 auto;
	min-height: 500px; /* to stop footer coming up on empty pages */
	background-image: url("../images/bg_contentbox.png"); /* semi transparent background */
}
#footer {
	position: relative;
	bottom:0;
	margin:0;
	padding:0;
	width:100%;
	height: 250px; /* height of my footer */
	background-color: #8cc553;
	z-index: -1;
}
#left {
	float: left;
        width:500px;
	margin: 0;
	padding: 0;
}
.push {
	clear:both;
}
#right {
	float:left;
	width:380px;
	margin: 0 0 0 20px;
	padding: 0;
}

1.  #container { 
2.      position: relative; 
3.  } 
4.  #content { 
5.      position: relative; 
6.      top: 0; 
7.      width: 900px; 
8.      margin: 0 auto; 
9.      min-height: 500px; /* to stop footer coming up on empty pages */ 
10.      background-image: url("../images/bg_contentbox.png"); /* semi transparent background */ 
11.  } 
12.  #footer { 
13.      position: relative; 
14.      bottom:0; 
15.      margin:0; 
16.      padding:0; 
17.      width:100%; 
18.      height: 250px; /* height of my footer */ 
19.      background-color: #8cc553; 
20.      z-index: -1; 
21.  } 
22.  #left { 
23.      float: left; 
24.          width:500px; 
25.      margin: 0; 
26.      padding: 0; 
27.  } 
28.  .push { 
29.      clear:both; 
30.  } 
31.  #right { 
32.      float:left; 
33.      width:380px; 
34.      margin: 0 0 0 20px; 
35.      padding: 0; 
36.  }