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

如您所见，该按钮似乎与文本有点偏移（较低），如何使它们显示为水平对齐？

我已经尝试过弄乱padding，margin，vertical-align并没有成功，真的很感谢你们其中任何CSS专家提供的帮助！ 谢谢！

Answer 1

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

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

jsFiddle示例