显示图像和文本内联和垂直居中

Question

我试图像这样内联显示图像和文字：

图片文字

图像是一个圆圈所以我希望文本垂直位于图像的中心，因为图像比文本稍大一些

这是我到目前为止所做的：

#contactinfo-text {
    font-size:30px;
    color:#F36F25;
    display:inline;
    margin-bottom:30px;
}
#contactinfo-text:hover {
    color:#666666;
}

<img src="../images/icons/telephone.png" height="60" /><div id="contactinfo-text">01702 66 77 27</div>

任何想法？

Answer 1

使用vertical-align属性：

vertical-align: middle;

演示：http://jsfiddle.net/FlameTrap/Hwq3Z/