Css 如何使子元素匹配flex grow元素的高度？

我知道有很多问题和我类似，但flexbox的复杂性让我无法承受。我需要的似乎很简单。我希望主体与视口的高度和宽度相等。然后，我希望里面的所有东西都能相对于它的父母进行缩放。然而，事实并非如此。我有一个

，然后我有一个子

嵌套在里面。我希望孩子的身高与父母的身高相匹配。但是不，根本不是现在发生的事

如何调整此图像的大小以适应粉红色区域？如何使此行的高度与粉红色区域的高度相匹配

正文{
身高：100%；
宽度：100%；
位置：绝对位置；
}
#粉旗{
宽度：100%；
身高：90%；
背景色：#FFCFC8；
}
.头衔{
字体系列：“Pacifico”，草书；
字体大小：70px！重要；
颜色：#48555E；
}
.厚边框{
边框：纯蓝5px；
}
.标题{
显示器：flex；
证明内容：中心；
}
.正文{
字体系列：“源代码Pro”，monospace；
字体大小：45px；
颜色：#ffffff；
文本阴影：2px2p5px#4a4a4a；
}
.文本阴影{
文本阴影：2PX2PX10PX#B3；
}

试验
言语

问题在于图像没有调整到适合父对象的空间。将引导类-img流体提供给img标记，它应该可以正常工作

<img src="https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png" class="img-fluid" alt="">

---

看看给它是否能解决问题

你能解释一下你在那里遇到的问题吗？我在小提琴上找不到一个？在第二个“列”分区中有一个

h-100

。我需要右边的图像留在粉红色区域内。你能检查一下标记是否更新了吗？因为我没有在小提琴上看到它？我在第二排看到的是哦，我的天，我很抱歉。我在重用一个旧的JSFIDLE，但忘了保存这个新的JSFIDLE。现在应该更新。不幸的是，这并没有解决问题。不过，谢谢你的帮助！你有包括引导程序吗？这是一个引导类！现在的问题是什么？在给班级img流体后，图片是否适合家长？是的，我确实包含引导。问题是图像仍然溢出粉红色区域之外。我希望那个div和粉色区域的高度一样，但是当我把一张更大的图片放进去时，它就在那个区域之外了。对不起，我不知道这是否有意义？