I have a question regarding a vertical align of my image and text

I have someone like

```
<div id='div1'>
  <div id='div2'>
    text here, more and more and more and more texts…….
    <img src='test.png' class='img'/>
  </div>
</div>

#div2{
    border-color: black;
    border-style: solid;
    border-width: 0 1px 1px 1px;
    padding: 10px;
    font-size: .8em;
}

#div1{
    width: 250px;
}

.img{
   float:right;
   vertical-align:middle;
}

```

I want my result like

```
text here, more and more and more            
and more and more and more and more         img here
texts

```

Can anyone help me about it? Thanks a lot!

The image will be in vertical middle no matter how many line of texts I have.