固定宽度，HTML中的100％高度对象

Question

所以，也许我只是吮吸搜索，但我找到一个方法来做这件事真的很麻烦，所以这里......

我有一个固定图像背景的网页（平铺，非滚动）。 我现在希望在它上面有一个彩色div（700px宽，100％高度，居中），然后我可以放入更多内容（不一定是div，我只想在中心有彩色区域） 。）

以下是我正在努力的形象：http://bit.ly/g5qgj0 我想要实现的是浅色区域（在其上面是其他所有东西）。

在此先感谢，我仍然了解HTML / CSS，这让我疯狂了XP

Answer 1

html, body{
    margin:0;
    padding:0;
    height:100%;
}
body{
    background:transparent url(...) repeat 0 0;
}
div{
    margin:0 auto;
    width:700px;
    height:100%;
    background:white;
}

检查http://jsfiddle.net/TGt4A/

处的工作示例

Answer 2

我认为你最简单的方法是使用Javascript / jQuery，我做了in JSFiddle。如果禁用Javascript或其他任何内容，您可能希望在min-height上添加一个CSS #container作为后备。