padding-top百分比不准确的问题
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body{
padding:0;
margin:0;
}
.main{
width:300px;
margin:50px auto 0;
background:#3c3c3c;
padding-top:20%;
}
</style>
</head>
<body>
<div class="main"></div>
</body>
</html>为什么padding-top成了相对于body宽度而来的呢
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
[max/min-]width、left、right、text-indent、padding、margin 等都是相对于父级宽度的
[max/min-]height、top、bottom 等是相对于父级高度的
padding是指定子元素相对于该元素的位置。建议：尽量不是将
margin和padding在一起使用。设计之初就是这样的，stackoverflow和csdn上都有很多猜想，
知乎这个答案我很久之前看的，觉得靠谱
CSS中margin-top/bottom(padding-top/bottom)百分比为何以最近的块级祖先元素的宽度而不是高度作计算？
另外其实一些不错的css书上都会讲一些css的一些常见误区，可以找几本看一看
推荐两本《css世界》《CSS Secrets》