极客观点
项目管理
HarmonyOS
flex布局怎么再设置子元素两侧对其的情况下设置最后一行左对齐？
子元素个数和父元素的宽度不定，本来是通过flex布局设置justify-content: space-between,但是如果最后一行元素不能填满的话，就会居中对齐，子元素中间会出现大片空白。后面想过justify-content: flex-start,但是这样的话因为父元素宽度不定，会出现右侧出现一定的空白。请大家帮看看怎么处理，谢谢~
相关代码
<style type="text/css">
.list-area {
display: flex;
flex-wrap: wrap;
align-content: flex-start;
// 下面这个是第一个结果的
justify-content: space-between;
// 下面这个是第二个结果的
// justify-content: flex-start;
}
.list-item {
width: 200px;
height: 200px;
margin-right: 20px;
margin-bottom: 20px;
background: green;
}
</style>
</head>
<body>
<!--list-area宽度不定，list-item个数不定-->
<div class="list-area">
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
<div class="list-item"></div>
</div>[不好的结果1]
[不好的结果2]
codePen
填充若干空item（只要大于等于你一行的最大个数就行了）