Html CSS对齐文本和img

我不知道如何描述它-我想让评论看起来像facebook上的评论：

但我不知道如何像这样对齐文本-有什么建议吗？

这就是将文本与图像对齐的方式

<div>
<img style="vertical-align:middle" src="<imageUrl>">
<span style="">Your text</span>
</div>

">
你的文字

您可以使用

垂直对齐：top

使文本在顶部与图像对齐

HTML:

---

您可以这样做：

div{width: 200px;}
img{vertical-align: top;}
img, div{display: inline-block}

---

请参阅fiddle

您可以使用overflow:hidden执行此操作。可以在此处找到解决方案：它成功了！谢谢。

.text {
  display: inline-block;
  vertical-align: top;
  width: 300px;
}

div{width: 200px;}
img{vertical-align: top;}
img, div{display: inline-block}