Tenía un diseño hecho con 3 columnas, pero intentando cambiar el diseño del menú de la izquierda, el de la derecha se me ha montado encima del del medio :S
  
Código:
 BODY {
    font: 8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
    margin: 10 0 10 0px;
    text-align: center;
    background:url(fondochulo2.jpeg);
    background-attachment:fixed;
    
}
#contenedor{
    text-align: left;
    width: 770px;
    margin: auto;
    margin-top:100px;
    filter: alpha(opacity=50);
    opacity: .9;
    
  
    
   
       
}
#cabecera{
    
    
    font-size:12pt;
    font-weight: bold;
    padding: 3 3 3 10px;
    filter: alpha(opacity=50);
    opacity: .5;
    background:url(disseny3.png);
   
    
    
    
    
}
#cuerpo{
    margin: 10 0 10 0px;
    
}
#lateral{
   
 float:left;  
 width:110px;  
 background-color:#4d7986;  
 padding:10px;  
}  
    
 .menu_top_bg  
 {  
 width:113px;  
 background:url(menutop.gif) repeat-x;  
 height:22px;  
 padding-top:8px;  
 font-family:Verdana, Arial, Helvetica, sans-serif;  
 font-size:12px;  
 color:#FFFFFF;  
 font-weight:bold;  
 text-align:center;  
 margin-bottom:1px;  
 }  
 .sub_menu ul  
 {  
 padding:0px;  
 margin:0px;  
 }  
 .sub_menu ul li  
 {  
 font-family:Arial, Helvetica, sans-serif;  
 font-size:11px;  
 color:#FFFFFF;  
 line-height:32px;  
 border-bottom:1px dotted #93bcc3;  
 list-style-type:none;  
 text-indent:8px;  
 }  
    
 .sub_menu ul li a  
 {  
 text-decoration:none;  
 color:#FFFFFF;  
 }  
 .sub_menu ul li a.selected  
 {  
 background:url(selected.png) no-repeat;  
 float:left;  
 width:115px;  
 height:32px;  
 }  
 .sub_menu ul li a:hover  
 {  
 background:url(selected.png) no-repeat;  
 float:left;  
 width:115px;  
 height:32px;  
 }  
}
#otrolado{
    
    width: 135px;
    float: right;
    background-color:#ffffff;
    -moz-border-radius: 5px;
    margin-right:5px;
}
     
#principal{
    margin-left: 150px;
    background-color: #ffffff;
    padding: 4 4 2 4px;
    width: 465px;
    -moz-border-radius: 2px 10px 20px 2px;
    
    
}
#principal2{
    
    width: 465px;
    
}
#pie{
    background-color: #cccccc;
    padding: 3 10 3 10px;
    text-align:right;
    clear: both;
    -moz-border-radius:0px 0px 5px 5px;
    margin-left: 5px;
    margin-right: 5px;
} 
.degradado[class] {
background-image:url(degradado.png);
}
h1{
font-size:14px;
font-family:serif;
}
h2{
font: 8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
  Os dejo el código aquí a ver si sabeis cuál es la solución :S
Ayuda porfavor T_T  
el div que me queda montado encima es el div id="otrolado".