Html 嵌套在相对块中的绝对块在IE8中显示得更低

啊。我真的很讨厌跨浏览器兼容性。。。我正在Wordpress网站上为一个客户端创建一个弹出框，它显示在我悬停的项目的正下方（使用自定义快捷码）。我将top设置为16px，在Firefox中运行良好。然而，在IE8中，它似乎更深入。即使我将top设置为“0”，它仍然显示在包含日志的下方，而不是顶部

我还有一个相关的问题，IE8中的字体大小大约小2像素。在这之前也有一个

标记，但是删除它并没有多大变化——IE8中的字体大小仍然更小

以下是网页：

左侧的每个问号都有一个弹出窗口，当鼠标悬停在上面时会出现（有点像工具提示）。我需要让它在FF、IE、Safari和Chrome中工作。唯一不起作用的是IE。谢天谢地，他没有提到IE6，所以我不担心它，除非他挑出来

以下是HTML：

<span class="questions"><sup>(
<div class="popup_content"><span class="popup">?</span>
<div class="popup_inside" style="display: none;">We’ll ask questions to understand your business, objectives, competitive situation, and positioning statement.<br />

<a href="http://www.medicalmarcom.com/services/medical-device-marketing-discovery/"><span style="color:#15398c"><em>Read More >>></em></span></a></div>
</div>
)</sup></span>

---

好的，我相信这是由于ie8是如何呈现sup标签的。它认为其基线与文本的其余部分相同，而不是高于基线。如果你想用CSS来做这件事，我想考虑一下你自己的上标类。 似乎对我有用的东西

作为替代解决方案，它在IE7中的渲染似乎是正确的，您可以强制IE8进入IE7兼容模式。将这一行放在

的顶部。我不知道这会对IE9造成什么影响，但值得一试

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

对我来说，更改字体大小和最大值似乎可以使其与FF保持一致。你确定更改最高值不能解决它吗？这里肯定有其他事情发生。。。顶部：0应将框的顶部定位在父容器的顶部，而不是仅显示在其下方。我没想过要用它！很重要，但我甚至不知道它是否有效。。。我觉得这不是个好主意。更改顶部和字体大小值会更改所有浏览器的顶部和字体大小。如果我在IE中把它放得更高，它会把它在其他浏览器中的外观弄得一团糟。我不认为我工作的网站使用reset.css。。。如果是的话，它可能会解决这个问题。嗯。。。我确实试过移除sup标签，但它似乎没有任何作用。不过，也许我有别的东西在里面，把它弄乱了。然而，在问题中，不应该是位置：相对吗？我两个都试试。好吧，现在差不多了。这修复了IE中字体大小变小的问题。同时，弹出窗口似乎更近了一点。不过，肯定还有别的事，所以我会再仔细研究一下。我可能没有完全模仿您在JSFIDLE中所说的一切。值得注意的是，我删除了sup并将新值添加到.questions；我将它设置为相对，而不是绝对，因为绝对将（？）向右推得太远了。

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />