twitter-bootstrap - 内嵌文本的 twitter bootstrap 2.1 按钮

Question

自 Twitter bootstrap 2.1 版以来，我的按钮不再与它们前面的文本垂直对齐。

显然，在以前的版本中， btn 类有一个 left: float ，现在不再是这种情况了。

我想改变我的页面以适应这种变化取决于我，但我不知道如何改变它。

这是 2.0 版中它的样子：http: //jsfiddle.net/Sherbrow/5N6FQ/

这是 2.1 版中的一个：http: //jsfiddle.net/ndemoreau/UKwEU/

我能做些什么？

谢谢！

Answer 1

2.0 和 2.1 之间发生了很多变化，其中很多都与字体大小和行高有关。这是我想出的：演示（jsfiddle）

h1 small { vertical-align: middle; }
h1 small .btn-group {
    display: inline-block;
    vertical-align: text-top;
}

我怀疑这真的是 centered，但它应该足够接近。如果它在现实条件下不起作用（不同的按钮大小等），您应该尝试使用边距。

在 Firefox 15、Google Chrome 24 和 IE 9 上测试。

Answer 2

将表格内的文本和按钮包装在单独的单元格中几乎可以为您提供解决方案。然后，您可以使用填充将按钮准确定位到您想要的位置。

这就是您需要的所有 css，它使您可以很好地控制定位：

.textbefore  {  }
.buttonafter { padding-top: 4px; padding-left: 8px; }

一个有效的JSFiddle 演示。