我在垂直ul
中有链接其中一些很小(例如:Home)并且只在一条线上。然而,有些是两行(例如:注册我们 - 包裹到下一行)。
有没有办法让所有这些文字在ul?
中垂直对齐我的UL有75px的固定高度,内部的li(浮动:左侧使其垂直)。
li里面的a是display: block
,也有高度和宽度。
任何帮助都会非常棒,谢谢你,我无法在任何地方找到如何做到这一点。
由于
答案 0 :(得分:3)
我的猜测是,你有li
分钟浮动,将列表更改为使用display:inline-block;
代替浮动应该可以让你获得垂直对齐..
这可能不是直接交换,它可能需要一两个调整才能看起来与你拥有的一样,但是看到你的代码会帮助我们帮助你;)
抱歉,我的错误实际上是display: table-cell;
这是现代浏览器的答案,但是这在IE7及以下版本中无效。
我确信我已经使用inline-block为IE做了这个但是我在我的档案中找不到它..我现在要出去了,所以现在让你留下Chris Coyiers写的,其中列出了几个不同的如果您需要IE7支持,IE会在底部黑客攻击:Vertically Center Multi-Lined Text
答案 1 :(得分:0)
对此有更多的黑客攻击,我不知道所有浏览器的工作。 如果您使用的是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/
答案 2 :(得分:0)
这可能会为您提供一个额外的想法,即如何根据您的情况垂直对齐事物,http://blog.themeforest.net/tutorials/vertical-centering-with-css/并且它会针对每种方法提出货物和坏处。
GL