<view class='test'>
<view class='left'>
</view>
<view class='right'>
</view>
</view>
.test {
display: flex;
flex: 1;
justify-content: flex-start;
align-items: center;
flex-direction: row;
}
.left {
flex: 1;
width: 40px;
background-color: red;
}
.right {
flex: 1;
height: 400px;
background-color: #3A7EEE;
}
左边的容器没有高度,如果设置成
.left {
height: 100%;
width: 40px;
background-color: red;
}
为啥红色不自动占满容器高度。
.test { display: flex; flex-direction: row; } .left { display: flex; width: 40px; background-color: red; } .right { flex: 1; height: 600px; background-color: #3a7eee; }