problemas con alineamiento de capas

[lubtufano]

Prueba con esta modificación.

Código CSS:

<style type="text/css">
#menu {
width: 150px;
height: 500px;
float: left;
background-color: #366;
}
 
#imagenes {
height: -1%;
overflow: hidden;
}
 
#fotoG {
width: 400px;
height: 250px;
background-color: #fc0;
float: left;
}
 
#descrip {
width: 200px;
height: 250px;
background-color: #ff0;
float: left;
}
 
#foto1 
{
width: 100px;
height: 100px;
background-color: #ccc;
float: left;
clear: left;
}
 
#foto2, #foto3, #foto4 {
width: 100px;
height: 100px;
background-color: #ccc;
float: left;
}
 
.imagen {
width: 95%;
height: 95%;
}
</style>
 
<div id="menu">menu</div>
<div id="imagenes">
<div id="fotoG"><img src="" class="imagen" alt="imagen_grande"></div>
<div id="descrip">Descripci&oacute;n</div>
<div id="foto1"><img src="" class="imagen" alt="imagen_chica_1"></div>
<div id="foto2"><img src="" class="imagen" alt="imagen_chica_2"></div>
<div id="foto3"><img src="" class="imagen" alt="imagen_chica_3"></div>
<div id="foto4"><img src="" class="imagen" alt="imagen_chica_4"></div>
</div>
 

Lo que se hizo fue agregar la propiedad 'float:left' a <div id="fotoG"> con lo cual el <div id="descrip"> es forzado a alinearse al lado de este; además, los estilos de la primera imagen pequeña se declaran por separado incluyendo en estos la propiedad 'clear:left' lo que provoca que este <div> se posicione en la siguiente linea limpia a su izquierda, el resto de <div> contenedores de imagenes pequeñas son colocados al lado del primero con la propiedad 'float:left'.
Por último te recomiendo, por si no lo haz hecho, que pongas al declaración DTD la comienzo de tu página, ya que con esto la compatibilidad de los estilos con diferentes navegadores sera mejor.