将图像与文本对齐[重复]

Posted 2023-03-05

【中文标题】将图像与文本对齐[重复]

【英文标题】：Aligning images with text [duplicate]

【发布时间】：2014-11-04 13:29:29

【问题描述】：

我无法将图像与文本对齐。我希望我的图像在左侧，内嵌文本在右侧，与图像垂直居中。

<div class="container">
    <span class="icon">
        <img ... />
    </span>
    <span>555-1212</span>
</div>

现在，文本紧贴容器顶部。如何将它垂直居中到容器的中间？

【参考方案1】：

.container span 
    display: inline-block;
    vertical-align: middle;

应该这样做。 jsFiddle

【讨论】：

placekitten.com 可能是我最喜欢的新原型资源。

嘿，我已经用了很多年了，喜欢那个网站。当我厌倦了小猫时，有时我会使用placecage.com。

这实际上不起作用。让图片比文字小或者文字比图片大你会看到失败