No necesitas dos divs para hacer eso (Supongo que los bordes que dibujaste son solamente para dar una idea más aproximada de lo que quieres). Usa un solo div con las dimensiones totales y dentro simplemente pon el (los) textos y la imagen:
Código HTML:
Ver original<img src="imagenes/mi_imagen.png" /> Texto bla, bla, bla....
Y usa un css mas o menos como este:
Código CSS:
Ver original.mi_div{
width: 500px;
height: auto;
/* Más atributos */
}
.mi_div img{
float: right;
margin-left: 1em;
margin-bottom: 1em;
}
El ancho de los párrafos (<p></p>) está determinado por el elemento padre y por los elementos con propiedad "float" junto o dentro de ellos. Ese código debe pegar la imagen al "borde" derecho del <p> mientras que los textos fluyen a su alrrededor dejando el margen que tu especifiques.
Saludos