如何将嵌入式图像与文本对齐？

Question

我有简单的div

<div class="ui-bar-a ui-corner-top">
    first_test | Status: <img src="templates/style/images/reload.gif" />
</div>
<div class="ui-bar-a">
    sms1 | Status: <img src="templates/style/images/reload.gif" />
</div>
<div class="ui-bar-a ui-corner-bottom">
    sms2 | Status: <img src="templates/style/images/reload.gif" />
</div>

看起来像：

我需要它像：

我尝试设置margin:auto align="middle"，但没有帮助

Answer 1

尝试放置

.ui-bar-a img{
    vertical-align: middle;
}