关于flex布局_前端问题_站长_知道

父div display: flex flex-dir*: row

有两个子div，

左面的子div 高度由内容撑起，同时也撑起了父div的高度

在不能手动指定高度的情况下

右面的子div怎么自动占满父div的高度呢？

已解决悬赏分：0 - 解决时间 2021-11-29 02:21

点赞 0反对 0举报 0 收藏 0

回答2

最佳

@vip10010

少侠，你这个需求不是默认表现吗？
align-items 的默认值是 streach，就是每一个子项撑满父元素高度。

或者针对某个子元素单独设置align-self也可以

支持 0 反对 0 举报

2021-11-28 09:15

@fei1024

谢邀。可以参考bootstrap等各大ui样式库的样式写法 container row col

html:

<div class="container">
    <div class="row left">
        
    </div>
    <div class="row right">
        
    </div>
</div>

css:

.container{
    display:flex;
    flex-direction:row;
}
.row{
    flex:1;
    display:flex
}
.left{
    
}
.right{
    
    background-color:red;
    width:100%
}
.col{
    
}

支持 0 反对 0 举报

2021-11-28 10:23