CSS边距推动body元素
Ric*_*ich 5 html css layout margins
我为div元素设置了边距，但是body元素也获得了该边距。
考虑以下代码：
<!-- HTML -->
<body>
<div>
</div>
</body>
<!-- CSS -->
<style>
html,body {
height:100%;
margin:0;
padding:0;
outline:1px solid blue;
}
div {
margin:20px;
outline:1px solid red;
}
</style>
这是结果和问题：
到目前为止，我已经通过向border:1px solid transparent;body元素添加属性解决了该问题。因为滚动条由于1px边框而出现，所以这破坏了100％的高度。为什么会这样？
可能的解决方案（感谢您的帮助）：添加a padding-top:1px和a margin-top:-1px，这样滚动条不会破坏100％的高度，并且可以避免边距塌陷。
这听起来类似于我遇到的问题：边距和负边距。我通过放置顶部填充而不是边框解决了我的问题，也许这更适合您的设计？否则请尝试此链接：http://www.seifi.org/css/understand-taming-collapsing-margins-in-css.html