Vertically align text next to an image?

Actually, in this case it’s quite simple: apply the vertical align to the image. Since it’s all in one line, it’s really the image you want aligned, not the text.

<!-- moved "vertical-align:middle" style from span to img -->
  <img style="vertical-align:middle" src="" alt="A grey image showing text 60 x 60">
  <span style="">Works.</span>

Tested in FF3.

Now you can use flexbox for this type of layout.

.box {
   display: flex;
<div class="box">
    <img src="">
    <span style="">Works.</span>

Leave a Comment