我有以下html:
div,包含该标签的标签和下拉列表(选择)。在标签和下拉列表上放置一个vertical-align:center,结果是标签居中,但下拉列表不居中。我认为其中心是“下拉列表上方和下方的等间距”。 IE显然认为中心的是将下拉列表的底部与标签的底部对齐,遗憾的是,这看起来并不是很好。我该如何解决这个问题?
编辑:因为位置相对而不紧急;很容易解决问题,但使用position:relative;让我烦恼,不应该是必要的。
答案 0 :(得分:2)
垂直居中是一种pain in the butt ......
在坚果壳中,您需要使用top:50%
为元素赋予绝对位置。由{em>包含元素的高度来衡量top
。这将把元件半件的顶部放在容器下面。然后你给它一个负的上边距,该元素是中心高度的一半。
答案 1 :(得分:2)
你基本上错过了vertical-align属性。它只能在表格单元格中使用。不是在div上。它也是垂直对齐:中间;不是中心。
vertical-align:middle:将元素的垂直中点与。对齐 父元素的基线 加上父母的x高度的一半。
我认为这篇文章清楚地解释了为什么:http://www.ibloomstudios.com/articles/vertical-align_misuse/
关键是baseline
,因为这是元素对齐的点。