我正在使用 jQuery 代码使用 margin-top（而不是顶部）将 div 设置在计算位置，这在除 IE8 之外的所有浏览器中都能完美运行。（它确实在 IE6 和 IE7 中工作）。
我将问题缩小到这样一个事实，即如果我使用 jQuery 设置上边距，它不会在 IE8 上更新，边距保持由 CSS 设置。我在一些论坛上看到这是一个常见的 IE8 问题，并且我找到了一些解决方法，但我发现了一些让我怀疑它是否真的是错误的东西？！我将所有代码减少到以下内容，但仍然无法正常工作：
这是 HTML 的正文：
<body>
<div class="menu_header"></div>
<div class="main_content"></div>
</body>
这是CSS代码：
.menu_header
{
position:relative;
background-color:red;
margin-left:auto;
margin-right:auto;
width:950px;
height:50px;
}
.main_content
{
position:relative;
margin-top:0px;
width:950px;
height:500px;
background-color:black;
margin-left:auto;
margin-right:auto;
}
最后是 jQuery 代码。
$(document).ready(function(){
$(".main_content").css("margin-top","100px");
})
好吧，如果您在 IE8 中尝试之前的代码，您将正确定位第一个 div (.menu_header) 但第二个 div (.main_content) 将没有任何边距。我认为 jQuery 根本没有更新 HTML/CSS 并且 0px 的原始值仍然有效，所以我使用 IE8 中的开发人员工具检查，发现 CSS 代码已经更新（内联 CSS）但仍然没有显示上边距。
正如我所说，我在互联网上发现这是一个已知的 IE8 错误，由于各种原因（例如边距折叠与设置为浮动的 div 和其他解释取决于 CSS“内容”），但我最初有一个jQuery 代码的一部分让我想知道这个错误的真正含义是什么，因为没有任何解释可以与此相符？！
为了清楚起见，我在原始 jQuery 代码中所拥有的只是几行，我将其简化为以下内容：
$(document).ready(function(){
$(".main_content").css("margin-top","100px");
$(window).resize(function(){$(".main_content").css("margin-top","100px");})
})
好吧，在这段代码中，您可能已经注意到，还有一行（第 3 行）用于在用户调整浏览器大小时设置 margin-top 并且神奇的是，当用户调整浏览器大小时，margin-top 会更新并当文档准备好（第 2 行）时，显示正确但仍然无法正常工作！
我继续玩（是的，在这一点上它变成了一个游戏，因为微软不能认真这样做！）我注意到在 HTML 代码中，如果我在 div 之后添加<p>some text</p>或<span>some text</span>或任何带有内容的元素，该问题不会发生，并且边距会正确更新。
所以，基本上，我不是在寻找解决方法，因为我有两个方法是添加一个带有内容的 div 并将其高度设置为 0 和 overflown:hidden，这样它就不会改变网站设计或<p> </p>在 div 之后添加。
我只是希望有人可以向我解释为什么当文档准备好而在 resize() 时更新边距不起作用以及为什么在 div 解决问题后添加一些 HTML 以及是否有任何其他解决方案可能是什至比我有的更简单？