如何在图片旁边对齐数字？

Kala J 发表于 Dev

卡拉·J

我注意到这个问题已被处死，但由于某种奇怪的原因，它对我不起作用。

这是我的CSS：

.sNums {
    font-weight:bold;
    font-family:Arial;
    font-size:10px;


}

这是我的html：

<td>
                        <div class="sNums">
                           2
                        </div>
                        <img style="vertical-align:middle; margin: 0 0 14px 14px" src="@Url.Content("~/Content/images/Red.png")" alt="logo" width:"100"  />

</td>

但是，它显示为类似于向左对齐的2，然后图标出现在2的底部。我希望图标显示在2的旁边。我不确定为什么它不起作用。

我尝试了vertical-align：中间，就像许多SO帖子所建议的那样，但是图像徽标仍然出现在数字的底部。

迈赫迪·沙哈米利安（Mehdi Shahamirian）

如果减小图像边距，则减少数字和图像之间的距离会更小，如果没有提供更多详细信息，请查看此希望，这也是您正在寻找的希望。

的CSS

.sNums {
font-weight:bold;
font-family:Arial;
font-size:10px; /* or use 20px */
float:left;
margin-top:6px;}

的HTML

<td>
                    <div class="sNums">
                       2
                    </div>
                    <img style="vertical-align:middle; margin: 0 0 14px 14px; width:50px;" src="http://static.freepik.com/free-photo/computer-room_21237883.jpg")" alt="logo">

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。