如何垂直对齐跨度为右侧的图像？

Question

我试图做的非常相似，对齐文本一些图像问题旁边：Vertically align text next to an image?

不同的是，我想要的图像浮动的权利，但似乎当我让它float:right;中， vertical-align解决了这个问题不再工作？有没有办法让img漂浮在右边，并让文字保持中间对齐呢？

<div style="width:100px"> 
    <span style="vertical-align:middle">Doesn't work.</span> 
    <img style="vertical-align:middle;width:30px;height:30px;float:right"> 
</div> 

在此先感谢！

Answer 1

使行高与图像相同。

Answer 2

从图像中删除float: right。对于div，请将text-align: right。它应该解决问题。

<div style="width:100px; text-align: right;"> 
    <span style="vertical-align:middle;">Does work.</span> 
    <img style="width:30px;height:30px; vertical-align: middle;"> 
</div> 

希望这会有所帮助。 :)