CSS盒子模型问题答案

【问题标题】：CSS box model issueCSS盒子模型问题
【发布时间】：2021-10-12 15:43:25
【问题描述】：

我一直在尝试为我的一个项目找出 CSS。

我有一个类'header-container'应用于 div 容器，检查时如下 -

我有一个疑问，为什么 'wrapper' div 的内容是 'header-container' div 的子级，不完全在内容框（即蓝色突出显示的框）内，并且可以在橙色中看到部分。请在下面找到包装器 div 的 CSS -

为什么元素 CSS 不遵循 CSS 框模型？又该如何解决？

【问题讨论】：

请参阅：Why not upload images of code/errors when asking a question?How to create a Minimal, Reproducible Example。 Questions linking to external web sites instead of showing code.
我忘了添加项目的链接。我已经编辑了描述以包含它。您可以检查它的发布位置并直接解决问题，而不是最小的可重现示例。 ;)
问题是你设置的是固定高度，所以内容溢出而不是让容器变大。只需删除 height 属性就可以了，不知道为什么需要它
meta.stackoverflow.com/questions/254428/… 在此处发布您的代码并创建一个可重现的最小示例

【解决方案1】：

答案就在你的图片中：

橙色部分是您设置的 2vh 顶部和底部边距。

去掉height: 2vh，或者切换到min-height: 2vh，问题应该就解决了。

【讨论】：