使用 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 example