Why does this inline-block element have content that is not vertically aligned

Question

Came across a weird CSS issue. Can someone explain why the box having content is not vertically aligned?

If you put text inside the span with class .divPutText

Answer 1

try this

.divPutTextToFixIssue {
   display:inline-block;
 }

jsFiddle