How to prevent display:flex content from stretching?

Question

css

Please help, I ran into such a problem

. Avatars stretch the content, which causes the bottom scroll to appear, put the avatars themselves in the display: flex container and center alignment, as the customer said that the avatars would appear from the center.
Previously, I also encountered this problem, but then it was solved by overflow: hidden on the parents, this time it doesn’t work because the parent has a shadow.
Actually, the question is, how to disable content stretching for display: flex?
Page for clarity https://profi.ngens.ru/unk/dist/index.html

Answer 1

Well, considering that by default the display is flex - but-wrap, then everything is right. there are 2 options:
1. put a wrap on the parent and dump the children
2. this line is generally just like a gallery and there is no new line on the minimum and it will be just either a custom scroll or left / right arrows

Answer 2

First you need to decide how exactly the line should look if the elements do not fit. I see several options here:
1. Move to a new line, center the new line
2. Move to a new line, but align to the left, if the content is not enough for 2 lines - align to the center
3. Display only what fits into the line
4. Scroll .
From this and dance