为什么不是这些元素与显示:inline-block的正确对齐?元素、正确、不是、inline

2023-09-11 07:34:55 作者:不言语不代表不爱你°

我有一个显示设置为 inline-block的的链接,并在它旁边是一个< D​​IV> 具有相同的高度。但是,< D​​IV> 莫名其妙地泛起抵消向下,我不知道为什么。

I have a link with display set to inline-block, and next to it is a <div> with the same height. However, the <div> is somehow appearing offset downwards, and I'm not sure why.

下面是一个的jsfiddle: http://jsfiddle.net/2bWjx/1/

Here's a jsFiddle: http://jsfiddle.net/2bWjx/1/

#stats (灰色)的出现比低下来a.sector一个字母

#stats 同样应设置(顶部和底部在同一地点)的 a.sector一个字母

#stats should be equally set (top and bottom at the same point) as a.sector one-letter.

我一直挣扎着这一段时间,并且可以使用一些帮助。应该是一个简单的解决!

I've been struggling with this for a while, and could use some help. Should be a simple fix!

感谢提前任何帮助!

推荐答案

您需要添加垂直对齐:顶部到任何具有显示: inline-block的

You need to add vertical-align: top to whatever has display: inline-block.

查看: http://jsfiddle.net/thirtydot/2bWjx/2/

默认垂直对齐基线,这将导致你所看到的问题。

The default vertical-align is baseline, which causes the problem you're seeing.

您可以在这里看到的各种可能值之间的差异:http://www.brunildo.org/test/inline-block.html

You can see the difference between the various possible values here: http://www.brunildo.org/test/inline-block.html