Foros del Web - Se ve bien mal en IE pero bien en Firefox

Recién estoy aprendiendo css, tengo un problema me muestra las paginas con errores en Internet Explorer pero en firefox me salen perfecto.

¿¿Hay algo extra en internet explorer??

Acá están las imagenes
-----------------------------------------------------------------------------------------------
Internet explorer:
http://img151.imageshack.us/img151/4931/dibujo2kj3.jpg
************************************************** **********
Firefox;
http://img146.imageshack.us/img146/3110/dibujocs2.jpg
************************************************** **********

Estructura que uso:
Las lineas de rojo representan cada tabla creada, la azul representa la division entre dos columnas.
http://img169.imageshack.us/img169/8391/01bu3.png
************************************************** **********
************************************************** **********
************************************************** **********

Este es el codigo html donde está el problema

Código:

<table cellspacing=0 class="tabla_main">

<tr>
 

<td style="background-color: #142140;  width: 209px;" valign="top">
 

<div id="menu01"><img src="imagenex/jaime3_menu1.gif" alt="Menu Principal" align="left"><img src="imagenex/jaime3_menu3.gif" align="right"></div> 

<div id="textoloco1">Menú</div>
 

<table id="tabla04" cellspacing=0 cellpadding=0><tr>
 

<td bgColor="#8b9fb8" height="24" onMouseOver="this.className='d2_2'" onMouseOut="this.className='d1_1'"><div id="menu02"> - Home</div></td></tr><tr>
 

<td bgColor="#b6c2d1" height="25" style="border-top: 1px solid #355074" onMouseOver="this.className='d2_2'" onMouseOut="this.className='d2_1'"><div id="menu02"> - Fotos</div></td></tr><tr>
 

<td bgColor="#8b9fb8" height="25" onMouseOver="this.className='d2_2'" onMouseOut="this.className='d1_1'" style="border-top: 1px solid #355074"><div id="menu02"> - Tutoriales</div></td></tr><tr>
 

<td bgColor="#b6c2d1" onMouseOver="this.className='d2_2'" onMouseOut="this.className='d2_1'" height="25" style="border-top: 1px solid #355074; border-bottom: 1px solid #bedaff"><div id="menu02"> - Textos</div></td></tr><tr>
 

<td bgColor="#8b9fb8" height="25" onMouseOver="this.className='d2_2'" onMouseOut="this.className='d1_1'" style="border-top: 1px solid #355074"><div id="menu02"> - Comentarios</div></td></tr><tr>
 

<td bgColor="#b6c2d1" onMouseOver="this.className='d2_2'" onMouseOut="this.className='d2_1'" height="25" style="border-top: 1px solid #355074; border-bottom: 1px solid #bedaff"><div id="menu02"> - Sobre mi</div></td></tr><tr>
 

</table>

y este es el css:

Código:

body 

{

background-color: #c2cde0;

margin: 0;

padding: 0;

}
 

.tabla_main {

padding: 0px;

margin: 0px;

border: 0px;

border-left: 1px solid #FFFFFF;

border-bottom: 1px solid #FFFFFF;

border-right: 1px solid #FFFFFF;

}

h1 {

font-family: verdana;

color: #9dff77;

font-size: 18pt;

}
 

h2 {

font-family: verdana;

color: #98add3;

font-size: 13px;
 

}
 
 

.main1 {

background-image: url("imagenex/jaime3_02.gif");

width: 768px;

height: 130px;
 
 

}

.tabla_1_2 {

background-image: url("imagenex/barra1_01.png");

width: 48px;

height: 34px;

border-left: 1px solid #FFFFFF;

}
 

.tabla_1_3 {

background-image: url("imagenex/barra1_02.png");

background-repeat: repeat-x;

width: 709px;

height: 34px;

}

.tabla_1_4 {

background-image: url("imagenex/barra1_03.png");

width: 13px;

height: 34px;

border-right: 1px solid #FFFFFF;

}
 

.principal1  {

width: 538px;

background-color: #142140;

color: #00FF00;

text-align: justify;

height: 250px;

text-indent: 19px;

padding-right: 20px;

}
 

.principal2  {

width: 40px

}
 

.tabla2_1 {

}
 

#menu01{

margin: 42px 15px;

background:url(imagenex/jaime3_menu2.gif);

background-repeat: repeat-x;

position: absolute;

width: 178px;

}
 
 

#textoloco1{

color: white;

margin: 48px 45px;

font-family: verdana,arial,tahoma;

font-weight: bolder;

font-size: 14px;

position: absolute;
 

}
 

#copyright{

font-family: arial; 

font-size: 8.5pt;

text-align: center;

}
 

#menu02{

font-family: tahoma;

font-size: 10pt;

padding: 0px 20px;

font-weight: bold;

color: #0d2039;

}
 

.menu03 a {

font-family: tahoma; 

font-size: 10pt;

padding: 0px 20px;

}
 

#tabla04 {

margin: 70px 15px; 

border-left: 1px solid #bedaff;

border-right: 1px solid #bedaff; 

border-top: 1px solid #bedaff; 

width: 178px;

}

Necesito ayuda, sugerencias para solucionar este problema, hay algo que pase en internet explorer, alguna sugerencia con el código???....Se los agradeceria mucho