设置flex:1和marginTop时，flex:1的值没有包含marginTop的值
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style>
.container{
height: 100vh;
display: flex;
flex-direction: column;
}
.top{
height: 200px;
background-color: lightblue;
}
.bottom{
flex: 1;
margin-top: 16px;
background-color: lightcoral;
}
</style>
</head>
<body>
<div class="container">
<div class="top"></div>
<div class="bottom"></div>
</div>
</body>期望正好占一屏幕，实际是出现了滚动条，如何达到预期？
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
通过图片可以看到。他是包含在内的。那么你的为什么不行呢？是不是有什么其他的间距
*{padding:0;margin:0;}尝试一下呢？因为
body元素默认带有margin，加上.container的 100vh，大于视口高度