子级没有渲染父级的 %height 吗？[重复]
发布于2025-01-19 22:39 阅读(855) 评论(0) 点赞(8) 收藏(1)
这是我的提琴的链接，供参考。
.container {
background-color: gray;
position: relative;
padding: 20px;
height: 70%;
/* uncomment this and will work as expected */
/* height: 70px; */
}
.child1 {
width: 75%;
display: inline-block;
height: 100px;
}
.child2 {
background-color: green;
width: 75%;
float: right;
height: 100%;
}<div class="container">
<div class="child1">Child 1</div>
<div class="child2">Child 2</div>
</div>计算完 child1 后，父级的高度为 100px（可以在 devtools 中看到）。Child2 应用了 100% 高度，相当于 100px，但在计算样式中（可以在 devtools 中看到）它显示 0px。
我猜是因为父母的身高是在运行时计算的。有什么帮助吗？
解决方案
因为父级高度也是百分比。它将在以下条件下起作用：
- 你的 div 的父元素有 100% 的高度
- 你的 div 的父级具有固定高度
- 你的 div 的父级有一些内容，因此它有一定的高度。
目前，它还不能100%知道到底是什么。
所属网站分类: 技术文章 > 问答
作者：黑洞官方问答小能手
链接：http://www.qianduanheidong.com/blog/article/538963/65783e46ba103b5fdb67/
来源：前端黑洞网
任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任
昵称:
评论内容：(最多支持255个字符)
---无人问津也好，技不如人也罢，你都要试着安静下来，去做自己该做的事，而不是让内心的烦躁、焦虑，坏掉你本来就不多的热情和定力