html - how can I align to middle by height

I want to create image box(with image).
It's ugly when text is in the top of box.

How can I align text to middle?
I tried to use vertical-align, but it seems, that it don't works

Demo of my code

EDIT:
Your solution works fine with short messages.
But if they will be multi-lined, it is ugly again.
Is it possible to not increase size of line If we don't need it?

Answer

What usually works fine is line-height:

line-height: 32px;

http://jsfiddle.net/DhHnZ/2/