用jQuery按钮水平对齐带椭圆的文本

Question

我试图用jquery按钮水平对齐一些文本（带省略号），但无法弄清楚发生了什么。

这里有一个jsfiddle显示我的问题：

http://jsfiddle.net/5bVDu/

<span>
    <span id='heading'>Long Heading That Requires Ellipsis</span>
    <span id='hiddenID'>ID</span>
    <button id='closeTab'></button>
</span>

正如你所看到的，按钮似乎与文本有一点偏移（较低），我如何使它们水平对齐？

我试过处理填充、边距和垂直对齐，但没有成功，我真的很感激你们中任何一位css大师的帮助！谢谢

Answer 1

将vertical-align:top添加到#closeTab:

#closeTab {
    height: 16px;
    width: 16px;
    margin-left:5px;
    vertical-align:top;
}

jsFiddle示例