我有一个白色居中的容器DIV，它的高度至少应为窗口的100％，但是如果其中的文本较长，则DIV应该扩展以适合内容。而是，超出窗口高度的文本部分会变成灰色背景。
我尝试了一些你的建议，我读过如把min-heightS的，而不是height在S body，html和#cntr，但白色的容器完全消失。添加overflow:hidden到#cntrsimply会将文本剪切为窗口的大小，使其部分完全不可见。
这是我的代码（这里没有一些不是特别重要的CSS）：
<!doctype html>
<html>
<head>
<meta content="charset=UTF-8">
<style type= "text/css">
html{
height:100%;
margin: 0;
}
body {font-family: Georgia; height:99%; margin: 0.25% 0}
div {position: absolute}
#cntr {
width: 1250px;
display: block;
position: relative;
top: 0;
float: none;
margin: 0 auto;
background-color: white;
height:100%;
}
</style>
</head>
<body style="background-color: #708090">
<div id="cntr">
<div style="right: 0; top: 0; width:100%; height: 261px; border-bottom: solid 1px black">
<a href="index.html"><img src= "png/logojan2.png" style="position: absolute; top:55px; left: 240px"></a>
<img src="png/rze.png" style="position: absolute; right: 50px; bottom:24px">
</div>
<div style="top: 300px; left: 50px; height: 60%; width:300px">
<div style="position: fixed; background-color: black; height: inherit; width: inherit">
</div>
</div>
<div style="top:300px; left:400px; width:800px">
/*some long <p>'s of text here*/
</div>
</div>
</body>
</html>
编辑：这是向下滚动后页面的屏幕截图（白色DIV应该延伸到页面底部）：屏幕截图
感谢您提供有关如何解决问题的建议。
解决了问题！
我在某处读到了with元素从页面流position: absolute中取出，因此出于目的被认为是零高度min-height。我也尝试将设置min-height: 200px为#cntr，并且出现了一个小的白色方块。我仍然不知道为什么min-height: 100%白色div会完全消失，但是现在效果很好。
因此，更改
div {position: absolute}
至
div (position: relative}
相应地调整坐标和设置min-height: 100%，而不是height: 100%为#cntr解决这个问题对我来说。
感谢您提供的所有帮助和想法，并希望此答案会有所帮助。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句