gpt4 book ai didi

css - 内部 div 填充屏幕的其余部分(受包装边距和填充限制)

转载 作者:行者123 更新时间:2023-11-28 13:55:49 24 4
gpt4 key购买 nike

我需要内容 div 来“填充”页眉之后剩余的屏幕剩余部分。我想保留 wrapper 的填充和边距。使用绝对位置不起作用,因为内容 div 不再在视觉上嵌套在包装器中。 (如果绝对必要,标题 div 可以是固定高度,但我更希望它是动态的。)非常感谢。

* { 
margin:0px;
padding:0px;
}

html,
body {
height: 100%;
}


#wrapper {
background-color:#eee;
margin:20px; padding:20px;
border: solid 1px #333;
}

#header {

}

#content {
background-color:red;
}

.

<body>
<div id="wrapper">
<div id="header">header</div>
<div id="content">content</div>

</div>

</body>

在这里 fiddle : http://jsfiddle.net/jHLhK/

最佳答案

将内容 div 的宽度和高度指定为 100%

#content {
background-color:red;
width:100%;
height:100%;
}

100% 表示它将与周围元素的可用空间一样多。

或者您可能只希望 heightwidth100%,具体取决于您的要求。

关于css - 内部 div 填充屏幕的其余部分(受包装边距和填充限制),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10818522/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com