Internet explorer 在IE7及更早版本中，如何将子元素定位在其父元素之后

我试图在Internet Explorer中创建一个模糊的阴影（类似于CSS3框阴影）。最合乎逻辑的方法似乎是在IE中找到所有需要阴影的元素，并使用jQuery在其中注入一个新的div。这个新的div将填充与其父对象完全相同的空间，然后可以使用IE的模糊过滤器对其进行模糊。html将如下所示：

<div id="parent">
    <div class="ie_shadow"></div>
    All visible content goes here.
</div>

除了IE7和早期版本似乎不允许您将子元素放置在其父元素之后，不管您如何设置“位置”和“z索引”，这将非常有效（只需稍加调整以确保不同区域的重叠正确工作）

另一个选项是在需要阴影的框之前或之后插入.ie_shadow div，但这本身有一些问题。具体来说，没有好的方法来设置阴影的宽度（和位置），除非它是由需要阴影的div显式设置的。如果用户调整页面大小，此方法似乎也会崩溃，因为.ie_shadow的高度和宽度是显式设置的，不会自动重新计算

非常感谢您的帮助。谢谢

---

编辑：关于一个活生生的例子，请参见此处：对于我们这些不再拥有IE7的人来说，将IE8设置为以IE7标准模式显示页面会忠实地再现这个问题。

最好的答案可能是：“IE6和IE7的某些方面非常糟糕，没有简单的解决方法。这似乎是其中之一。”

显然，这不是一个很好的答案，所以下面是我可以尝试的。我将使用jQuery的

wrap（）

函数包装元素，而不是将阴影作为元素的绝对定位子元素插入

$(document).ready(function(){
    $('.has_shadow').wrap('<div class="ie_shadow"></div>');
    $('.ie_shadow').each(function(){
        var childwidth = $(this).children('.has_shadow').css('width');
        $(this).css('width', childwidth)
    });
});

$（文档）.ready（函数（）{
$（'.has_shadow'）。换行（''；
$（'.ie_shadow'）。每个（函数（）{
var childwidth=$（this）.children（'.has_shadow'）.css（'width'）；
$（this.css（'width'，childwidth）
});
});

现在唯一的挑战是使父元素与其子元素具有相同的宽度。浮动页面仍然有效，但它有可能彻底破坏页面的原有设计。可能可以使用javascript找到子对象的宽度，并将父对象设置为相同的值，但这只有在子对象具有定义的实际值时才有效。我还在玩弄这个，但看起来这是我能得到的最好的答案

$(document).ready(function(){
    $('.has_shadow').wrap('<div class="ie_shadow"></div>');
    $('.ie_shadow').each(function(){
        var childwidth = $(this).children('.has_shadow').css('width');
        $(this).css('width', childwidth)
    });
});