display:table-cell在img标签上没有效果？

做垂直居中，居中元素大小不固定，于是选择CSS table的方式来解决，HTML结构如下：

<div id="parent">
  <img src="pic64.png" class="box" />
  <span class="box">Many text here.</span>
</div>

样式：

#parent {
  height: 350px;
  width: 600px;
  background: yellow;
  display: table;
}
.box {
  display: table-cell;
  vertical-align: middle;
}

结果是图片并没有垂直居中的效果，需要在img外套一个div才能达到预期效果，可行的HTML结构：

<div id="parent">
  <div class="box">
    <img src="pic64.png"/>
  </div>
  <span class="box">Many text here.</span>
</div>

为什么要额外套一个div呢？