Text floating in block next to image

I would like to achieve the following placement:

Two different texts (in block) floating / inline next to image. (Everything inside div).

I have been trying with different display settings (block + inline for text etc.) but it is still not working.

HTML:

<div class="res">
<img src="<?php echo 'img/'.$row["sType"].'.png';?>"/>
<span>TITLEe</span>
<span>Description</span>
</div>  

CSS:

.res {

    height:60px;
    background-color:yellow;
    border-bottom:1px solid black;
    text-align:left;

}

.res img {

    margin-top:8.5px;
    margin-left:5px;
    display:inline
}

.res span {

    display:block;
}