Hola!
Pude más o menos dejarlo como querés ( te paso al final lo que modiqué), quedaria que veas bien en el div izquierdo el ul que se va de ese contenedor (probablemente problemas con los width).
En el IE vas a notar que se corre para abajo, eso es porque hay un problema con los anchos que le pasaste; vos pusiste como fijo que el ancho total sea de 700px, y por lo tanto la suma de todos los sub-bloques tienen que dar eso. Cuando usas margin y padding te come tambien pixeles (para que no tengas en cuenta solo los width de cada div). Tambien en el caso del IE6 (no se del 7) no trabaja bien los paddings asi que lo vas a notar distinto tambien.
Yo suelo separar las hojas de estilos para diferenciar entre los browsers, porque en la mayoria de de los casos no se toman igual las propiedades en uno que en el otro, entonces aclaro las diferencias en un .css distinto para los IEs
Codigo Css de solo los modificados:
Código:
.derecha{
width:150px;
height:auto;
background-color:#FFFFDD;
border-style:solid;
border-width:1px;
background-color:#000000;
margin:0 5px 5px 0;
float:right;
padding-top:5px;
padding-bottom:5px;
.principal{
width:390px;
height:auto;
background-color:#FFF;
border-style:solid;
border-width:1px;
background-color:#000000;
/*margin:0 5px 0 117px;*/
margin-right:5px;
padding:10px;
float:right;
}
.footer{
width:auto;
height:30px;
background-color:#FFF;
border-style:solid;
border-width:1px;
border-color:#000000;
margin:5px;
clear:both;
}
Espero no se me haya olvidado de alguno :P
Suerte!
