How to make one flex item bigger than others?

Question

css

There is a flex container with three elements. It is necessary to make one element wide, and the other two are less wide and the same in width. An example is shown below.



How to do it?

Answer 1

Yab did this on grids, there are convenient functions for such placement.
Specifically on flex, play around with flex-grow on each element. I suspect that it will be enough to specify flex-grow: 1 for small tiles and 2 for large ones