非常简单的CSS最小高度100％带有边距的问题
[英]Very simple CSS minimum height 100% issue with margin
问题描述
我在寻找建议，当它的顶部边距为15px时，如何将div设置为min-height：100％？ 我想要的是让div触摸屏幕底部（不触发滚动条），但是当内容太大而无法容纳时，它会自动扩展到屏幕限制以下，从而触发滚动条。 这是我到目前为止所得到的：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body, html{height:100%; margin:0;}
body{background:#AAA}
#main{position:relative; width:970px; margin:0 auto; border:solid 1px #666; background:#FFF; margin-top:15px; min-height:100%;}
</style>
</head>
<body>
<div id="main">
try duplicating this content until it does not fit in the box
</div>
</body>
</html>
2 个解决方案
解决方案1
0 2012-01-15 20:07:58
您可以使用以下CSS将div固定到底部
#main{position:fixed; bottom : 0px; width:970px; margin:0 auto; border:solid 1px #666; background:#FFF; margin-top:15px; min-height:100%;}
解决方案2
0 已采纳 2012-01-16 13:25:00
我找到了一种解决方案：在主体上使用新的CSS3 框大小调整规则，并将其设置为padding-top：15px; 删除#main上的margin-top，它的工作原理与上述所有新浏览器中的描述完全相同。
简单的CSS保证金问题
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.