Cita: No se como puedo hacer que el de la izquierda ocupe el hueco que deja libre el de la derecha. Si pongo width:100% el de la derecha se me baja. Si lo pongo en px no se me hace mas grande cuando amplio la pagina
En principio, en el codigo que pusiste no coinciden los id. A corregirlos.
Para el div izquierdo podes usar width auto (valor por default) y se va a adaptar a su contenido. Pero no uses min-width:400px; porque no es compatible con todos los navegadores.
Lo que podes hacer sino para un diseño líquido es darle un valor de 80% y al otro div un valor móvil de 20%. Esto funciona (dependerá de si necesitas valores fijos o no):
Cita: #Principal{
height:400px;
width:90%;
background: black
}
#Izquierda{
height:100%;
width:80%;
vertical-align:top;
float:left; background: yellow
}
#Derecha{
height:100%;
width:20%;
vertical-align:top;
float:right; background: blue
}
nota: ese 100% total es respecto al div principal, no al ancho de pagina.