Html 列BG图像赢得'；不要延伸到100%的高度

我有一个左栏，有一个背景图像和另一个身体背景图像，所以它填充了屏幕的其余部分。我在左列的右侧有一个内容区域，该区域将垂直延伸到浏览器窗口之外。当左列设置为100%高度时，一旦我向下滚动，左列的背景图像将不会超过屏幕的原始大小。是否有一种纯css的方式使左列延伸超过浏览器窗口的原始高度，以匹配内容区域

---

添加规则

后台附件：固定到您的
主体
元素。
请检查演示

你知道如何使用jQuery吗？如果您有任何疑问，请回答我，我会按照这种情况编写此代码
如果我正确理解您的问题，您需要使用
等高列
技术。谷歌搜索解决方案给我带来了很多麻烦。在那里，您可以找到不同的方法使边栏与主内容区域相等。只需选择最好的一个：）
当您将html和主体标记高度设置为100%时，它们都将其高度设置为浏览器窗口的内部高度，这意味着它们都具有相同的值，并且也是一个固定的值。由于您的div#container和#left是body元素的子元素，并且与body元素相关，因此它们相应地设置了100%的高度，即内部高度

此外，如果你需要一个问题的答案：那么为什么div#right扩展了呢？这是因为它没有扩展而是溢出了。而且由于您没有告诉body或#container或#right将overflow属性设置为hidden，因此它们都不能阻止这种浏览器行为。在这种情况下，您假设原始窗口高度是溢出导致的高度。
是的，但如果您将内容从正确区域取出，则它不再是100%高度。
html {
    height: 100%;
}
body {
    height: 100%;
    background-image: url(../images/rightPanel.png);
    background-repeat: repeat;
    height: 100%;
}

#left {
    background-repeat: repeat-y;
    width: 207px;
    padding: 10px;
    float: left;
    height: 100%;
    background-image: url(../images/leftPanel.png);
}
#right {
    height: 500px;
    padding: 10px;
    min-width: 773px;
    float: left;
}
#container {
    position: relative;
    min-width: 1100px;
    height: 100%;
    background-repeat: repeat;
}

var right_height = jQuery('#right').height();
var left_height = jQuery('#left').height();
jQuery('#left').height(right_height);​