jquery - IE8 隐藏内容后 wrapper 的高度还是一样的

Question

前言

我又遇到了一个奇怪的 Internet Explorer 问题，我碰壁了。 更准确地说，是IE8。我在IE7也测试过，没有问题，所以IE8有点问题..

注意有一个 JSFiddle example在这篇重现我的问题的帖子底部。

---

快速解释

我有这个 ul，它用于在单击 span.content_head 时扩展/收缩内容。默认情况下，首先显示内容。

<div id="spreadsheet_overview">
    <ul class="overview_list">
        <li>
            <div class="content_head">
                <div class="indicator"></div>
                Recipe calculation
                <div class="summation">
                    <span class="title">1 tablet cost:</span>
                    <span class="value">0.09360828</span>
                </div>
            </div>
            <div class="container">Lots of content</div>
        </li>
    </ul>
</div>

$("div.content_head").click(function(e){
    $(this).next(".container").toggle();
    $("div.indicator",this).toggleClass("contracted");
});

---

问题

点击签约时出现问题。让我首先向您展示它在 Firefox 中的外观以及它的工作原理。

该文件包括

• body - 略带深灰色
• wrapper ，亮灰色
• 分隔栏，深灰色
• 更多分隔线，白色

可以看到，文档在“配方计算”后结束，文档的高度已经调整，去掉了垂直滚动条。
包装器也调整了它的高度。

但是，在 Internet Explorer 8 中，当我执行相同的操作时，包装器会保持其高度，就好像内容仍在显示一样。为什么在IE中不调整高度？

我已经检查过了，高度和隐藏内容之前完全一样。

如果这是一个 CSS 问题(我确定是)，它可能是什么？

---

JSFiddle

Here's a JSFiddle可以重现我的具体问题。我已尝试将 CSS 缩减到只包含本期中的元素。
这可能是我用 CSS/HTML 完成的。
希望你们中的一个能发现它，因为我绝对不能...

点击“Recipe calculation”会隐藏内容，你会发现高度还是一样的。在 IE8 中。

感谢您的帮助!

编辑

w3d 指出，在开发人员工具中切换 height: auto 属性时，将调整包装高度。经过进一步调查，当我调整窗口大小时，它会做同样的事情。

Answer 1

改变:

.fix{display: inline-block;}

收件人:

.fix{display: block;}

IE 不知道内联 block 是什么。