How to align image and title and text next to it?

Question

I want to align images on left and <h> and <p> text on right next to it like this:

What is the best way to do this so it will work best for responsive design as well ?

http://jsfiddle.net/kfV7F/

Answer 1

img {
    width:200px;
    height:200px border:1px solid;
    vertical-align:middle;
    float:left;
}
span:after {
    clear:both;
    content:"";
    display:block;
}

jsfiddle

after text you must clear float