我遇到了一些奇怪的CSS行为。但是，它在Firefox，Chrome和IE（9）中的工作方式完全相同，所以我怀疑它是CSS标准的一部分，但是，我找不到任何可能出现这种情况的原因。
我有一个带有一些文字的div。当我将font-size设置为大于行高时，div的高度是使用行高计算的，但内容要大得多。也就是说，框中的文本比框本身大得多。我有一个jsfiddle与这里的情况：
如果将鼠标移动到边界框上方，则可以在输入div之前看到悬停css激活。同样，单击靠近但仍在框外部会激活javascript单击事件。更容易看到内容框在这里：
当div上的display属性设置为inline时，正确计算高度（由于各种样式原因，我无法做到这一点）。此外，如果我将overflow属性设置为hidden，则问题就解决了。对我来说，这表明内容比其包含的框大，但我不知道为什么。特别是我想知道为什么对象的“高度”css框模型属性小于页面上显示的实际高度。
我已经看过CSS规范了，我没有在那里看到我的答案，但我怀疑我可能会遗漏一些东西。
修改
我发现以下链接引用了我所遇到的问题，但我不知道它们的来源是什么，或者为什么会出现这种情况。
另外，为了回应我收到的一些答案，我不是在寻找如何修复我的CSS，因此悬停问题不再出现了，我正在寻找为什么它正在发生在第一名。
再次编辑 显然，盒子的任何内容，无论是否在盒子的边界内，都会调用悬停在盒子上。 （请参阅Lister先生对This answer的评论。我真正想知道的是规范中的这一行为来自哪里。它在那里？还是所有浏览器都同意的实现？
答案 0 :(得分：1)
使用overflow：hidden隐藏div之外的任何内容。
它的表现正确，因为孩子可以存在＆amp;可以在元素的块区域之外移动。
这种技术经常用于通过使用负边距/填充/绝对定位等移动块元素的内部块，但这些块将始终保持父元素的悬停能力。
答案 1 :(得分：0)
div的大小不正确。这是正常的行为。 您错误地使用了CSS。 div高度由其中的行数定义。您给出了比line-height更大的字体大小，这意味着它只能采用max-line-height来定义所需行数。
顺便说一下，有什么意义可以定义比行高更大的font-seize？