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

Add vertical-align:top in your .divAccountData, .divAccountPicker class as like this

.divAccountData, .divAccountPicker {
    vertical-align: top;
}

LIve demo

If you used to display:inline-block; than used to all-ways vertical-align:top