最佳答案
我在弹性元素的子元素不响应百分比 height
的弹性方块列上遇到了麻烦。我只在 Chrome 中检查过这个问题,据我所知,这是一个 Chrome 专有的问题。下面是我的例子:
超文本标示语言
<div class='flexbox'>
<div class='flex'>
<div class='flex-child'></div>
</div>
<div class='static'></div>
</div>
CSS
.flexbox{
position:absolute;
background:black;
width:100%;
height:100%;
display: flex;
flex-direction:column;
}
.flex{
background:blue;
flex:1;
}
.flex-child{
background:red;
height:100%;
width:100%;
display:block;
}
.static{
background:green;
width:100%;
height:5rem;
}
我想让红色的 .flex-child
填充蓝色的 .flex
。为什么 height:100%
不工作?