The following may sound familiar: you have a row of floating divs with varying heights and want to align them neither top nor bottom – but vertically centered? In the good old days of table-layouts that was easy. You would just throw the divs in one table cell each and tell that cell to display its content valign=”middle”.

But in times with mostly CSS powered design that might sound a little bit difficult.  But ‘table’ is the right keyword here: you can use a containing outer div (container / parent object) with the behavior ‘table row’ and give the contained inner divs (child objects) the behavior ‘table-cell’ – then you can apply the css property vertical-align: middle – and Bob’s your uncle.

Here’s a jsfilddle with a working example:
jsfiddle.net/nH2sd/5/

And this question-answer-post at brought me to the above fiddle:
“How to center vertically a floating div inside an inline-block?”
stackoverflow.com/questions/…/how-to-center-vertically-a-floating-div-inside-an-inline-block