在按钮中对齐JQuery UI图标

Question

我有点困难让图标图像在我的按钮中正确对齐。如果你转到http://jsfiddle.net/Vw9Z6/7/，你会发现图标的浮动高于“继续”一词。我想图标和单词“继续”在同一行。我可以使用margin-top来使其工作，但在我看来，根据用户屏幕分辨率，它可能不可靠。

关于如何解决这个问题的任何想法？

非常感谢。

Answer 1

将.my-button-icon替换为以下内容：

.my-button-icon {
    margin-left:10px;
    display: inline-block;
}

float: right;弄乱了对齐：http://jsfiddle.net/Vw9Z6/11/

<强>更新

您可能也希望使用vertical-align: middle;。我认为在当前文本大小的情况下，如果没有vertical-align样式，对齐看起来会更好，但这可能会随着字体的增加/减少而改变。

Answer 2

您可以将按钮的位置设置为相对位置，然后将按钮的图标绝对定位吗？如果你这样做，那么正在查看的分辨率无关紧要。