img旁边的居中文本被打破了

Question

通常＆＃34;让垂直居中的东西紧挨着img＆＃34;但我需要两条线。它很好用一行，但看起来像<br />那些。

<img style="vertical-align: middle;">Centered text

结果：

IMG
IMG   text here
IMG

但如果我想这样做：

<img style="vertical-align: middle;">Centered text<br />new line

IMG
IMG   centered text
IMG
new line

如何解决这个问题？

Answer 1

将文字放入div display: inline-block，或使用float: left获取图片。

小提琴： http://jsfiddle.net/k4hkS/1/

Answer 2

你走了。

<强> LIVE DEMO

HTML：

<img src="https://www.google.co.in/images/srpr/logo11w.png" style="vertical-align: middle;"><div>Centered text<br />new line</div>

CSS：

div{display: inline-block;}

希望这有帮助。

Answer 3

如果您在听到“table”一词时没有运行，则可以使用表格轻松完成此操作，并从css文件中自定义。

您可以使用单元格的内嵌样式：align="left" valign="center"

在这里演示：
http://jsfiddle.net/bsj4t/