html - 为什么`min-height`会影响flex布局中div的高度？

Question

我在 flex 布局父级中添加了min-height一个。如果它的实际高度大于div，似乎会min-height产生影响。以下面的代码为例：divmin-height

https://codepen.io/zhaoyi0113/pen/ejwJGM

我将其设置100px为最小高度，div但如果其实际高度大于 100，它会相互重叠。在上述情况下，我希望div节目hello world在一个街区内，但事实并非如此。如果您检查 dom 结构，您会发现它<p>不会扩展其父级div高度。我该如何解决？

标签： htmlcssflexbox

Answer 1

由于您在.div1flex box 上设置了 200px 的高度，因此尝试将所有子元素都放在 200px 内，但是 min-height 会阻止它适应 200px 内的所有子元素。

根据您想要实现的目标，您可能需要更改高度或.div1添加flex-shrink: 0.div2