全屏幕背景图像，100％高度覆盖div

Question

看看这picture看看我想完成什么。基本上我想使用全屏背景图像，然后在左侧的徽标和导航后覆盖一个div（在链接的图片中，这是中间的灰色区域，周围有红色线条），总是会有100不管滚动的高度如何。

我认为我能解决这个问题的唯一方法是对垂直重复的灰色区域使用背景图像，然后为全屏幕背景图像制作div并更改z索引以获取所需的分层。

我使用了叠加的div的CSS是：

#overlay 
{ 
    position: absolute; 
    left: 360px; 
    top: 0; 
    bottom: 0; 
    width: 600px; 
    height: 100%; 
} 

但是，当你需要滚动较大的内容，在div总是在“折叠”结束，那么背景图像将接管其余的内容。

我有什么技巧可以利用纯粹的CSS来做到这一点吗？另外，由于跨浏览器的担忧，我不想使用CSS3多种背景。

Answer 1

尝试删除height: 100%并将位置更改为相对。

您可能需要添加一些填充和边距才能得到您想要的数据，但这只是为了解决它。