css之div未知高度,剩余div铺满整个屏幕

<div id="content">
            <div class="title">
            title1
            </div>
             <div class="title">
            title2
            </div>
             <div class="title">
            title3
            </div>
            <div id="article"></div>
</div>

当我们不知道class为title的div中内容有多高的时候,但是需要让article铺满剩余屏幕的时候,需要将content变为弹性盒,具体代码如下

.content{
display: flex;
flex-direction:column;
}
#article{
flex: 1
}

这样就可以了

    原文作者:Kingsley
    原文地址: https://segmentfault.com/a/1190000018834670
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞