Twitter Bootstrap 3 中导航栏中的元素如何垂直居中？

Question

我正在查看 Twitter Bootstrap 中的导航栏元素，看看它们如何将导航栏中的元素垂直居中，因为这是我一直在努力解决的问题。

我总是不得不求助于“随机”边距/填充值，我被告知这些值不好，因为它们是仅在特定上下文中起作用的神奇数字。

令人惊讶的是，我无法发现任何真正使元素垂直居中的东西 - 没有

line-height

欺骗或任何真正的东西，没有

display: table-cell

。

.navbar-brand

类的

line-height

为

20px

（如

.navbar-nav

内的链接）和

padding

为

15px

，但是它如何居中呢？他们是怎么做到的？

在这里您可以看到导航栏的代码：http://getbootstrap.com/components/#navbar

Answer 1

导航栏使用顶部和底部填充来垂直居中文本：

padding-top: 15px;
padding-bottom: 15px;

Answer 2

它们不会使文本垂直居中。

我通过使用Chrome中的inspect:element向导航栏元素添加文本来测试这一点。然后我用同样的方式强制宽度。文本换行到下一行。所有线条都在顶部对齐，而不是居中。