Credo che convenga inizare con un minimo di codice:
codice:
HTML:
<html>
....
<body>
  <div id="tutto"> <!-- potrebbe anche non servire, dipende se c'e` altro nel body -->
    <div id="div1">
      ...
    </div>
    <div id="div2">
      <img src="..." alt="..." />
    </div>
  </div>
</body>
</html>
codice:
 CSS:
html, body {            /* necessari per poter usare le % all'interno */
  width: 100%;
  height: 100%;
}
#tutto {
  width: 100%;         /* copre tutto lo spazio del body */
  height: 100%;
  background: red;    /* come vuoi, ma per le prove servono gli sfondi diversi */
  min-width: 600px;   /* altrimenti la cosa non sta in piedi */
}
#div1 {
  width: 500px;
  height: 100%;       /* credo che intendessi cosi` */
  float: left;
  background: green;
}
#div2 {
  margin-left: 500px;
  height: 100%;
  background: blue;
}
#div2 img {
  height: 100%;      /* questo distorce l'immagine */
  width: 100%;
}
non so se ho interpretato tutto quanto chiedevi