个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
26
4
这是一个常见问题，但与我找到的解决方案略有不同，我一直在尝试解决它但没有成功，所以如果有人能在这方面给我帮助，我将不胜感激。
我有一个 #wrapper div，它延伸到浏览器的 100% 宽度和高度。到目前为止，一切顺利......现在，在#wrapper 中，我需要一个#content div，它会自动拉伸(stretch)，父div 周围保持30px 的边距。我(几乎)设法做到了，但我无法使#content div 的高度拉伸(stretch)。这是我正在尝试做的一个例子:
这是我的 CSS 代码:
* {
margin: 0;
padding: 0;
outline: 0;
}
html, body {
height: 100%;
width: 100%;
text-align: center;
cursor: default;
}
#wrapper {
width: 100%;
min-height: 100%;
height: auto !important;
position: absolute;
background: #333;
text-align: center;
}
#content {
/*width: 100%;*/
min-height: 100%;
height: auto !important;
margin: 30px;
overflow: hidden;
background: #ccc;
}
这是 HTML:
<body>
<div id="wrapper">
<div id="content">
This DIV should stretch to 100% height of its parent and body
minus the 30px margin around and resize as the window is resized.<br />
It's working in width but not in height!<br /><br />
Whatever goes in here (a child DIV) no matter its size should not be
visible beyond this DIV boundaries (as the Overflow is set to "hidden")!
</div>
</div>
</body>
这就是我在 Chrome 和 IE 中得到的结果:
有什么帮助吗？是否可以？我错过了什么愚蠢的东西吗？
提前致谢，LM
最佳答案
在您的 .css 中，将 #content 替换为以下内容
#content {
overflow: hidden;
background: #ccc;
position: absolute;
top: 30px;
left: 30px;
right: 30px;
bottom: 30px;
}
关于css - DIV 100% 高度内的可调整大小的 DIV，周围的边距效果不佳!请帮忙？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17263982/
26
4
0
我是一名优秀的程序员,十分优秀！