当元素使用flex布局，子级无法设置高度怎么办？

1.使用绝对定位

<div class="wrap">
<div class="header">头部</div>
<div class="main">
<div class="container">内容</div>
</div>
<div class="footer">尾部</div>
</div>

html,body{
width:100%;
height:100%;
}
.wrap{
width:100%;
height:100%;
}
.header,.footer{
height:40px;
}
.main{
display:flex;
postion:relative;
}
.container{
position:absolute;
width:100%;
height:100%;
}