Css 未填充包装的图像<；部门>；元素 问题是：

所以我有这个网页：

我有几个图像是分层在一起创建的背景梯度，但无论出于何种原因，两侧梯度并没有填充整个页面。所有渐变都位于包裹整个页面的元素中。如果我将其中一个div的溢出设置为overflow:auto；我可以将div滚动到页面的长度（为了测试，我将其设置为5000px），但它只在框中显示一个小的截断，据我所知，它在所有浏览器中都会这样做。有什么问题吗？为了进一步澄清，我说的是侧面的梯度是如何突然停止的

---

CSS: HTML:

... 页体

首先，建议在标记中使用较少的div，并且有更有效的方法来实现您想要的外观，但您将通过时间和实践了解这一点

首先，如果您想让左右两侧的渐变阴影跨越文档的高度，那么除了包装外，所有内容的外部都需要具有这些背景图像的div

下面是正确的标记：

<div id="super_wrapper">
    <div id="page_bg_left">
        <div id="page_bg_right">
            <div id="page_bg_top">
                <div id="page_bg_topleft">
                    <div id="page_bg_topright">

                    ... Page Body
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

---

嗯，似乎有某种高度继承发生了。

区域内的一个元素手动设置了高度，当我从该元素中删除高度时，背景填充了整个页面。我一点也不知道发生这种情况的原因。

请给我们发送一些代码，因为简单的英语只能在有限的范围内近似编码。

<div id="super_wrapper"><div id="page_bg_top"><div id="page_bg_topleft"><div id="page_bg_topright"><div id="page_bg_left"><div id="page_bg_right">
... Page Body
</div></div></div></div></div></div>

<div id="super_wrapper">
    <div id="page_bg_left">
        <div id="page_bg_right">
            <div id="page_bg_top">
                <div id="page_bg_topleft">
                    <div id="page_bg_topright">

                    ... Page Body
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

#page_bg_left {
  background:url(../images/body/left_shadow.png) repeat-y left;
  height:100%;
  overflow: hidden;
}
#page_bg_right {
  background:url(../images/body/right_shadow.png) repeat-y right;
  height:100%;
  overflow: hidden;  
}