导航中的垂直对齐li元素

Question

我在垂直ul

中有链接

其中一些很小（例如：Home）并且只在一条线上。然而，有些是两行（例如：注册我们 - 包裹到下一行）。

有没有办法让所有这些文字在ul？

中垂直对齐

我的UL有75px的固定高度，内部的li（浮动：左侧使其垂直）。

li里面的a是display: block，也有高度和宽度。

任何帮助都会非常棒，谢谢你，我无法在任何地方找到如何做到这一点。

由于

Answer 1

我的猜测是，你有li分钟浮动，将列表更改为使用display:inline-block;代替浮动应该可以让你获得垂直对齐..

这可能不是直接交换，它可能需要一两个调整才能看起来与你拥有的一样，但是看到你的代码会帮助我们帮助你;）

抱歉，我的错误实际上是display: table-cell;这是现代浏览器的答案，但是这在IE7及以下版本中无效。

我确信我已经使用inline-block为IE做了这个但是我在我的档案中找不到它..我现在要出去了，所以现在让你留下Chris Coyiers写的，其中列出了几个不同的如果您需要IE7支持，IE会在底部黑客攻击：Vertically Center Multi-Lined Text

Answer 2

对此有更多的黑客攻击，我不知道所有浏览器的工作。 如果您使用的是css3，则可以使用灵活的框布局：http://blog.isotoma.com/2010/08/css3-flexbox/ 如果不是，您可以使用'table'hack：http://www.456bereastreet.com/archive/201103/flexible_height_vertical_centering_with_css_beyond_ie7/

Answer 3

这可能会为您提供一个额外的想法，即如何根据您的情况垂直对齐事物，http://blog.themeforest.net/tutorials/vertical-centering-with-css/并且它会针对每种方法提出货物和坏处。

GL