css - Questions about Flex layout

Question

The code I use for flex layout is as follows:
.cszgroup-ul{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 15px; padding-bottom: 5px;}
.cszgroup-ul li{ width: 31%; margin-bottom: 10px;}
The result is this:

My question is: How can I align the red line frame part of the second row to the left?

Answer 1

I haven’t tried it, but I thought of a simple way? Add a placeholder p in the penultimate position and set its visibility to hidden. How about it?

Answer 2

cszgroup-ul {
  justify-content: flex-start;
}

Answer 3

If your li is not dynamically loaded, there is a stupid way to write an empty li and prop it up.

Answer 4

There is no good way, add additional li to occupy the space, and then dynamically add additional nodes to occupy the space after the li here is rendered.

Answer 5

Give him margin-left:auto;

for the last one